盒子里的猫

hey 标题又是我第一喜欢的魔幻现实主义 盒子是主题 而猫就抽象了 大概是薛定谔的吧

back 这次放的东西又很common 很期待什么时候 make something special ok! wait

一个学生信息管理系统的后台 写的时候chrome firefox 都ok 回来上Safari好像有一点显示问题 没有很多特效 但是基本的都有

建议csdn搞一个上传文件夹的选项 如果是我没发现 给它道个歉


添加信息页面的



	
		
		
		
		
		
	
	
		
		
信息显示页面的



	
		
		
		
		
		
	
	
		
		
学号 姓名 电话号码 毕业院校 家庭住址
1 CM 13897439222 湖北大学 亭林镇43号
2 CMMM 13897453542 湖北大学 亭林镇44号
3 CMCM 13886723473 湖北大学 亭林镇45号
4 MCCM 13893467922 湖北大学 亭林镇46号
5 MMMCM 13827890976 湖北大学 亭林镇47号
6 MCMCMC 13972828334 湖北大学 亭林镇48号

写到这里很气 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;
}

好的 完了!

你可能感兴趣的:(周常,^ _ ^)