火车票选择座位css样式怎么设置
时间: 2024-03-21 21:41:22 浏览: 114
php版12306查询火车票.zip
火车票选择座位的CSS样式可以根据具体的需求进行设置,下面是一些常用的CSS样式设置:
1. 座位容器样式设置:
```css
.seat-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
```
2. 座位样式设置:
```css
.seat {
width: 30px;
height: 30px;
margin: 5px;
background-color: #eee;
border: 1px solid #ccc;
text-align: center;
line-height: 30px;
font-size: 14px;
cursor: pointer;
}
```
3. 选中座位样式设置:
```css
.seat.selected {
background-color: #00bcd4;
border-color: #00bcd4;
color: #fff;
}
```
4. 已售座位样式设置:
```css
.seat.sold {
background-color: #ccc;
border-color: #ccc;
color: #fff;
cursor: not-allowed;
}
```
5. 座位类型样式设置:
```css
.seat.first-class {
background-color: #ffc107;
}
.seat.second-class {
background-color: #4caf50;
}
```
上述样式设置仅供参考,具体的样式设置可以根据实际情况进行调整。同时需要注意的是,座位的选中状态、已售状态等需要通过JavaScript来动态控制CSS样式的变化。
阅读全文