实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>关于我们</title> <link rel="stylesheet" href="css/1.css"> </head> <body> <div id="head"> <div id="nav"> <ul> <li>首页</li> <li>新闻</li> <li>产品</li> <li>关于我们</li> <li>联系我们</li> </ul> </div> </div> <div id="main"> <ul> <li>首页>关于我们</li> <h1 style="border-left:3px red solid ">关于我们</h1> </ul> <div class="zuo" style="clear: left;"> <video src="http://www.h3c.com/cn/pub/WebVideo/H3C.mp4" property="" style="width: 420px; height: 221px; float: left;"controls></video> </div> <div class="you" style="width: 423px;height: 225px"> <p class="p1" >数字化解决方案领导者</p> <p style="width: 470px;float: left"> 紫光旗下新华三集团（简称“新华三”）是业界领先的数字化解决方案领导者，致力于成为帮助客户业务创新、数字化转型最可信赖的合作伙伴。新华三拥有计算、存储、网络、安全等方面的数字化基础设施整体能力，能够提供云计算、大数据、数字化联接、信息安全、安防、物联网、边缘计算、人工智能、5G在内的一站式、全方位数字化平台解决方案，以及端到端的技术服务。同时，新华三也是HPE®***的服务器、存储和技术服务的中国独家提供商。 </p> </div> </div> <div id="foot"> <UL><dt>关于我们 </dt> <dd >手机号：17674111111</dd> <dd >邮箱：2175814398@qq.com</dd> <dd >姓名：小牛哥哥</dd> </UL> </div> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
实例
div[id=nav] ul>li {
list-style: none;
text-align: center;
color: white;
display:inline; /*平铺*/
margin-left: 25px;
}
div[id=nav] {
background-color: black;
height: 100px;
}
#head {
width: 830px;
height: 100px;
background-color: #39c3ff;
margin-left: 20%;
}
div[id=nav] ul {
padding-top: 5%;
}
div[id=nav] ul>li:hover {
color: #d80d27;
background-color: #39c3ff;
}
div[id=main] ul{
float: left;
}
#main {
margin-left: 20%;
}
.you .p1{
font-size: 18px;
color: #d80d27;
border-bottom: 2px red solid;
}
.you {
width: 423px;
height: 225px;
float: left;
}
#foot {
background-color: black;
width: 830px;
height: 100px;
margin-left: 20%;
float: left;
}
#foot UL{
color: white;
padding-left: 20%;
}运行实例 »
点击 "运行实例" 按钮查看在线实例
