Rumah >hujung hadapan web >html tutorial >index.css_html/css_WEB-ITnose
/* 样式初始化*/*{ margin: 0px; padding: 0px;}a{ text-decoration: none;}li{ list-style: none;}/*公用样式*/.border{ border: 1px solid #ff0000;}.center{ margin: 0px auto;}.bg{ background: yellowgreen;}/*三角形*/.sjx{ width: 15px; height: 15px; background: #FBFBFB; position: absolute; top: 10px; left: 112px; transform: rotate(45deg);}.title{ width: 409px; height: 40px; background: #FBFBFB; line-height: 40px; border-bottom: 1px solid #EEEEEE;}.title .name{ font-size: 15px; color: #6C6C6C; margin-left: 20px;}.title .more{ float: right; margin-right: 15px; color: #6C6C6C;}body{ background: #FBFBFB;}header{ width: 100%; height: 60px; background: #FFFFFF; position: fixed; top: 0; left: 0; z-index: 9;}#container{ width: 1200px; margin-top: 70px;}#container article{ width: 827px; display: inline-block; background: #FFFFFF;}#container aside{ width: 353px; height: 600px; display: inline-block; margin-left: 20px;}footer{ width: 1198px; height: 115px; margin: 10px auto;}header .header{ width: 1200px; height: 60px;}header .header .logo{ display: inline-block;}header .header nav{ width: 630px; height: 30px; display: inline-block; vertical-align: top; margin-left: 50px;}header .header nav ul li{ width: 100px; height: 60px; line-height: 60px; text-align: center; display: inline-block;}header .header nav ul li a{ color: #634444;}header .header nav ul li a:hover{ color: red;}header .header form{ display: inline-block; vertical-align: top; border: 2px solid #EEEEEE; border-radius: 5px; float: right; margin: 10px 10px 0 0;}header .header form #search{ width: 35px; height: 35px; border: none; transition: width 1s; -moz-transition: width 1s; -webkit-transition: width 1s; -o-transition: width 1s;}header .header form #mysubmit{ width: 24px; height: 35px; background: url("../img/search-icon.png") no-repeat 0px -1px; border: none;}article #jdt{ width: 821px; height: 340px;}/*主要内容区*/#cwarp{ border-top: 1px solid #EEEEEE; border-left: 1px solid #EEEEEE; margin-top: 20px;}#cwarp .content{ width: 409px; display: inline-block; border-right: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE; vertical-align: top;}/*图片大小控制*/#cwarp .content ul li{ margin: 9px; color: #6C6C6C; position: relative;}#cwarp .content ul li a{ color: #6C6C6C;}#cwarp .content ul li img{ width: 120px; height: 100px;}#cwarp .content ul li .c_img{ display: inline-block; vertical-align: top; width: 120px; height: 100px;}#cwarp .content ul li .c_con{ display: inline-block; vertical-align: top; width: 250px; height: 90px; background: #FBFBFB; padding: 5px 10px;}#cwarp .content ul li .c_con h4{ width: 250px; height: 30px; border-bottom: 1px solid #EEEEEE;}#cwarp .content ul li .c_con p{ margin-top: 5px; font-size: 14px;}aside{ vertical-align: top;}aside section{ width: 354px; background: #FFFFFF; border: 1px solid #EEEEEE; margin-bottom: 10px;}aside section ul li{ width: 330px; height: 35px; line-height: 35px; padding-left: 20px;}aside section ul li a{ font-size: 14px; color: #444444;}aside section ul li a:hover{ color: #ff0000;}.a_title{ width: 354px; height: 40px; background: #FBFBFB; line-height: 40px; border-bottom: 1px solid #EEEEEE;}.a_title .name{ font-size: 15px; color: #6C6C6C; margin-left: 20px;}.f_link{ width: 1198px; border: 1px solid #EEEEEE; background: #FFFFFF; margin-bottom: 50px;}.f_title{ width: 1198px; height: 40px; background: #FBFBFB; line-height: 40px; border-bottom: 1px solid #EEEEEE;}.f_title .name{ font-size: 15px; color: #6C6C6C; margin-left: 20px;}.f_link ul li{ display: inline-block; vertical-align: top; padding: 5px 15px;}.f_link ul li a{ color: #6C6C6C;}