网页制作实践步骤二 主页

来源:互联网 发布:淘宝学生证怎么搜 编辑:程序博客网 时间:2024/05/01 23:26

主页内容大致确定:

还是可以的吧0.0

其实最主要的是css代码:

/* Made by Liu Xindi since summer of 2015 *//*引用中文字体*/@font-face{    font-family: 'MyFont-normal';    src:url('../font/SourceHanSansCN-Normal.otf');    font-weight:normal;    font-style:normal;}@font-face{    font-family: 'MyFont-heavy';    src:url('../font/SourceHanSansCN-Heavy.otf');    font-weight:normal;    font-style:normal;}@font-face{    font-family: 'MyFont-light';    src:url('../font/SourceHanSansCN-Light.otf');    font-weight:normal;    font-style:normal;}@font-face{    font-family: 'MyFont-medium';    src:url('../font/SourceHanSansCN-Medium.otf');    font-weight:normal;    font-style:normal;}@font-face{    font-family: 'logo';    src:url('../font/Logo2.otf');    font-weight:normal;    font-style:normal;}/*样式重置*/body,ul,p,h1,h2,h3,h4,h5,dl,dd,form,input,textarea,select{    padding:0;    margin:0;}a{    letter-spacing: 3px;}li{    list-style: none;}image{    border: none;}a{    text-decoration: none;}a:hover{    text-decoration: none;}/*总体背景*/body{    background-image: url("../image/content-bg.jpg");}/* 导航栏 */.header{    border-bottom: 1px solid rgba(255, 255, 255, 0.2);    font-weight: 700;    background-color: transparent;    position: relative;    width: 1140px;    height: 111px;    margin:0 auto;}.header_left{    float: left;    height: 40px;    width: 135px;    margin: 35px 0;}.header_left a{    color:#ffffff;}.header_middle{    padding-left: 200px;    padding-top: 45px;}.list{}.list li{    float: left;    display: block;    width: 110px;    height: 34px;    text-align: center;}.list li a{    color: #ffffff;    text-align: center;    padding-top: 5px ;    margin-bottom: 0;    position: absolute;}.list a:hover{    border-bottom: 2px solid #FFF;}.header_right{}.header_right li{    float:right;    display: block;    width: 110px;    height: 34px;    text-align: center;}.header_right a{    color: #ffffff;    text-align: center;    padding: 5px 0}.header_right a:hover{    border-bottom: 2px solid #FFF;}.header_right a.btn{    background: #FFF none repeat scroll 0% 0%;    font-weight: 700;    padding-left: 10px;    padding-right: 10px;    color: #F56857}.header_right a.btn:hover {    border: 2px solid #FFF;    background: transparent none repeat scroll 0px 0px;    color: #FFF;}.btn {    cursor: pointer;    border: 1px solid transparent;    border-radius: 4px;}/*正界面*/.container{    text-align: center;    width: 1170px;    margin: 0 auto;    padding-top: 90px;    padding-left: 15px;    padding-right: 15px;}.myh1{    color: #ffffff;    font-size: 80px;    font-weight: 200;    letter-spacing: -2px;    margin-bottom: 25px;}.container p{    color:#ffffff;    letter-spacing: 3px;}


0 0
原创粉丝点击