HBuilderX 制作网页（大国工匠）

point.po

已于 2023-10-26 09:03:46 修改

阅读量4.7k

点赞数 4

分类专栏： css 文章标签： html5 css

于 2022-12-02 09:33:20 首次发布

本文链接：https://blog.csdn.net/niu_zhou/article/details/128142378

版权

css 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

css代码

body,ul,li,form,input,h1,h2,h3,h4,h5,nav,a,div,p{
   margin:0;
   padding:0;
}
a{
   text-decoration:none;
}
ul,li,ol{
   list-style:none;
}
#top{
   width:1000px;
   height:40px;
   line-height:40px;
   margin:0 auto;
}
#top_left{
   float:left;
}
#top_right{
   float:right
}
.clearfix{
   clear:both;
}
#top ul li{
   float:left;
   margin-right:20px;
}
#top ul li a{
   color:#666666;
   font-size:14px;
}
#banner{
   width:100%;
   height:295px;
   background-image: url(../img/banner.jpg);
   background-position: center top;
   background-size:100% 295px;
}
#nav_bg{
   width:100%;
   height:44px;
   line-height:44px;
   background:url(../img/bg_nav.jpg) repeat-x left center;
}
nav{
   width:1000px;
   margin:0 auto;
   font-size:0px;
}
nav li{
   display:inline-block;
   width:100px;
   text-align:center;
}
nav li:nth-child(4){
   width:140px;
}
nav a{
   font-weight:bold;
   font-size:18px;
   color: #FFf8d6;
}
nav a:hover{
   color: #7d2a00;
}
#main{
   width:1000px;
   margin:0 auto;
   margin-top:30px;
   overflow: hidden;
}
#news{
   width:650px;
   float:left;
}
#video{
   width:320px;
   float:right;
}
.img_bar{
   width: 100%;
   height: 36px;
   line-height: 36px;
   color: #FFFFFF;
   background: #ec8c25 url(../img/h2_bg.jpg) no-repeat left center;
   font-size: 16px;
   text-indent: 10px;
}
#main h2{
   width:100%;
   font-size:20px;
   margin-top:15px;
   margin-bottom:10px;
   font-weight:normal;
   margin-left:10px;
}
#main h2 a{
   color:#000;
}
#main h2 a:hover {
   color:#ff0000;
}
.news_list {
   border-bottom: 1px dashed #ccc;
   padding-bottom: 20px;
}

.news_list li {
   height: 25px;
   line-height: 25px;
   background: url(../img/arrow.jpg)no-repeat left center;
   text-indent: 10px;
}

.news_list li a {
color: #333333;
font-size: 14px;
}

.new_list li a:hover {
color: #ec8c25;
}

.news_list2 {
margin-top: 15px;
}

.news_list2 li {
   background: url(../img/vidicon.gif) no-repeat left center;
   height: 26px;
   line-height: 26px;
   text-indent: 20px;
}

.news_list2 li a {
font-size: 14px;
color: #333333;
}

.news_list2 li a:hover {
color: #005fe9;
}

#origin{
   width:1000px;
   margin:30px auto;
   overflow: hidden;
}
#origin ul{
   margin-top:20px;
}
#origin li{
   float:left;
   width:160px;
   margin-right:50px;
   text-align:center;
}
#origin li:nth-child(5){
   margin-right:0;
}
#origin li a{
   color:#333333;
   font=weight:bold;
}
#origin li a:hover{
   color:#EC8C25;
}
footer{
   width:1000px;
   margin:40px auto;
   border-top:2px solid #666;
   padding-top:30px
}
footer p{
   text-align:center;
   line-height:30px;
   font-size:14px;
   color:#666666;
}