hey 标题又是我第一喜欢的魔幻现实主义 盒子是主题 而猫就抽象了 大概是薛定谔的吧
back 这次放的东西又很common 很期待什么时候 make something special ok! wait
一个学生信息管理系统的后台 写的时候chrome firefox 都ok 回来上Safari好像有一点显示问题 没有很多特效 但是基本的都有
建议csdn搞一个上传文件夹的选项 如果是我没发现 给它道个歉
添加信息页面的
信息显示页面的
写到这里很气 chrome老是崩溃 换了一个浏览器 我滴心态炸了
下面是标题 按钮 选择框 以及 分页 的公共样式
/**/
.tips-title {
position: relative;
top: 10px;
}
.tips-title a {
letter-spacing: 4px;
}
a:hover {
color: #f00;
}
.tips-title a:first-child {
text-indent: 0.5cm;
}
hr{
border:1px solid rgba(0,0,0,0.1);
}
.container {
position: relative;
top: 20px;
padding: 10px;
min-height: 500px;
}
/*输入框公共样式*/
.input-group {
margin: 10px 10px 0 10px;
text-align: center;
}
.input {
width: 380px;
height: 40px;
padding: 0 10px;
box-sizing: border-box;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 5px;
transition: all .5s;
}
.input:focus {
border-color: rgb(255, 176, 24);
box-shadow: 0 0 10px rgba(255, 176, 24, 0.5);
}
/*按钮组织公共样式*/
.btn{
width: 78px;/*给定按钮宽度 可更改*/
height: 38px;
box-sizing: border-box;
border: 1px solid rgba(0,0,0,0.2);
line-height: 38px;
text-align: center;
cursor:pointer;
transition: opacity .9s;
}
.btn-sm{
width: 58px;
height: 28px;
line-height: 28px;
font-size: 0.9em;
}
.btn-primary{
color: #fff;
background-color: #0E90D2;
border-color: #0E90D2;
}
.btn-primary:hover,.btn-success:hover,.btn-second:hover,.btn-error:hover{
opacity: 0.8;
}
.btn-success{
color: #fff;
background-color: #5EB95E;
border-color: #5EB95E;
}
.btn-second{
color:#fff;
background-color: #3BB4F2;
border-color: #3BB4F2;
}
.btn-error{
color:#fff;
background-color: #DD514C;
border-color: #DD514C;
}
.btn-cord{
border-radius: 5px;
}
.sm-width{
width:280px;
}
/*选择框公共样式*/
.icheck{
position: relative;
margin: 0 auto;
display: inline-block;
width: 58px;
height: 22px;
line-height: 22px;
border: 1px solid rgba(0,0,0,0.2);
border-radius: 13px;
cursor: pointer;
overflow: hidden;
}
.thumb{
position: absolute;
left: 1px;
top: 1px;
display: inline-block;
width: 20px;
height: 20px;
background-color: rgba(0,0,0,0.2);
border-radius: 50%;
}
.icheck-label{
position: absolute;
margin-left: 10px;
display: inline-block;
height: 24px;
line-height: 24px;
}
::-webkit-input-placeholder{
color:rgba(0,0,0,0.2);
}
/*表格的公共样式*/
.table-box>table{
width:100%;
min-width: 800px;
border-collapse:collapse;
}
table th,table td{
padding:5px;
text-align: center;/*设置单元格内部的文本居中*/
}
table thead th{
border-top:1px solid rgba(0,0,0,0.5);
border-bottom:1px solid rgba(0,0,0,0.5);
}
table tbody td{
border-bottom: 1px solid rgba(0,0,0,0.1);
}
tbody tr{
cursor:pointer;
transition: background-color .5s;
}
tbody>tr:hover{
background-color: rgb(255, 255, 221);
}
/*分页公共样式*/
.pages {
width: 100%;
text-align: center;
}
.page-link {
margin-top: 20px;
text-align: center;
}
.page-link li {
display: inline-block;
margin-left: 5px;
}
.page-link>li>a {
display: block;
padding:0.5em 1em;
color:#0e90d2;
border:0.1em solid #ddd;
border-radius: 3px;
}
.page-link>li>a:hover{
background-color: #ddd;
}
.active-page{
color:#fff !important;
background-color:#3bb4f2;
border-color:#3bb4f2;
}