企业网站集成
Posted 月疯
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了企业网站集成相关的知识,希望对你有一定的参考价值。
css代码:
@charset "utf-8";
/*重置样式 css reset*/
*{
margin: 0;
padding: 0;
}
ul,ol,li{
list-style: none;
}
b,strong{
font-weight: normal;
}
i,em{
font-style: normal;
}
a,u{
text-decoration: none;
}
h1,h2,h3,h4,h5,h6{
font-size: 16px;
font-weight: normal;
}
#logo,#nav,#banner,.im,#news,#picture,#tb,#next,#loss{
width: 1000px;
margin: 0 auto;
}
/* logo */
#logo{
height: 100px;
background: #ccc;
}
#logo h1{
width: 227px;
height: 100px;
background: url(../img/tube.png) no-repeat center;
margin: 0 auto;
float: left;
}
#logo form{
width: 247px;
height: 61px;
float: right;
padding-top: 39px;
}
.txt{
width: 179px;
height: 26px;
border: 1px solid #f00;
background: #f1f1f1f1;
color: #858585;
padding-left: 14px;
float: left;
}
.btn{
width: 30px;
height: 28px;
border: 1px solid #f00;
background: #f1f1f1f1 url(../img/fdj.png) no-repeat center;
float: left;
border-left:none;
}
/* nav */
#nav{
height: 58px;
background:#000;
}
#nav li{
float: left;
width: 122px;
height: 58px;
border-right: 1px solid white;
line-height: 58px;
font-size: 12px;
text-align: center;
color:wheat
}
/*
1、导航必须使用无序列表去做
2、导航项嵌套:
<li>
<a href=""></a>
</li>
3、给li添加浮动
4、给li添加大小
5、调整文本
*/
#nav #first{
margin-left: 8px;
}
#nav #border0{
border: 0;
}
/* banner */
#banner{
height: 490px;
background: #ccc;
}
.im{
height: 490px;
}
/* news */
#news{
background: pink;
}
.news_l{
width: 500px;
height: 269px;
background: white;
float: left;
}
.news_l h2{
font-size: 18px;
line-height: 18px;
padding: 36px 0 0 22px;
}
/*
新闻列表
1、如果有时间html结构必须:
<li>
<a href="#">新闻内容展示</a>
<span>2021-7-21</span>
<li>
2、给li添加宽高(量行高)
3、调整文本样式(文本大小,颜色)
4、给span和a添加左右浮动
5、背景图的形式给li添加列表符号(调整背景图)
设置line-height文字上下居中
*/
.news_list{
padding-left: 21px;
}
.news_list li{
width: 451px;
height: 24px;
background: url(../img/dian.png) no-repeat left center;
margin-top: 10px;
margin-bottom: 10px;
line-height: 24px;
}
.news_list li a{
color:#585858;
float: left;
margin-left: 18px;
}
.news_list li span{
float: right;
}
.news_c{
width: 240px;
height: 240px;
float: left;
}
.news_c h2{
margin-top: 36px;
margin-left: 25px;
font-size: 18px;
}
.news_r{
width: 260px;
height: 240px;
float: left;
}
.news_r h2{
font-size: 18px;
line-height: 18px;
margin-top: 36px;
margin-left: 25px;
}
.small{
width: 200px;
margin-left: 25px;
margin-top: 11px;
}
.sma{
margin-left: 25px;
margin-top: 5px;
}
/* picture */
#picture{
height: 500px;
}
#tb td img{
width: 241px;
height: 200px;
}
#tb td p{
text-align: center;
margin-top: 10px;
}
/* next */
#next{
background: #ccc;
margin-top:18px;
height: 300px;
}
#loss{
height: 100px;
background: #F5DEB3;
}
#m1{
margin-top: 50px;
float: left;
margin-left: 200px;
font-size: 20px;
}
#m2{
margin-top: 50px;
margin-right: 200px;
float: right;
font-size: 15px;
}
html5:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/qiye.css">
</head>
<body>
<!-- logo -->
<div id="logo">
<h1></h1>
<form action="" method="">
<input class="txt" type="text" value="SEARCH..." />
<input class="btn" type="button" />
</form>
</div>
<!-- nav -->
<ul id="nav">
<li id=first><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li><a href="#">旅游介绍</a></li>
<li id="border0"><a href="#">旅游介绍</a></li>
</ul>
<!-- banner -->
<div id="banner">
<img src="img/banner.png" alt="" class="im"/>
</div>
<!-- news -->
<div id="news">
<div class="news_l">
<h2>公司新闻</h2>
<ul class="news_list">
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
<li>
<a href="#">新闻展示</a>
<span>2021-7-21</span>
</li>
</ul>
</div>
<div class="news_c">
<h2>公司介绍</h2>
<h2><strong>公司成立于2021年3月4日,上市进行专项审查,核准效果是一个伟大的创举。</strong></h2>
<h2>感谢大家一起共享</h2>
</div>
<div class="news_r">
<h2>人才招聘</h2>
<div id="img_box">
<img src="img/ik.png" class="small"/>
<img src="img/pp.png" class="sma"/>
</div>
</div>
</div>
<!-- piture -->
<div id="picture">
<table id="tb">
<th>
<td>
<img src="img/ik.png"/ >
<p>感谢大家开始学习html5</p>
</td>
</th>
<th>
<td>
<img src="img/ik.png"/ >
<p>感谢大家开始学习html5</p>
</td>
</th>
<th>
<td>
<img src="img/ik.png"/ >
<p>感谢大家开始学习html5</p>
</td>
</th>
<th>
<td>
<img src="img/ik.png"/ >
<p>感谢大家开始学习html5</p>
</td>
</th>
</table>
</div>
<div id="next">
</div>
<div id="loss">
<p id="m1">陕西生物科技有限公司</p>
<p id="m2">@copyright2021</p>
</div>
</body>
</html>
以上是关于企业网站集成的主要内容,如果未能解决你的问题,请参考以下文章
iphone / Objective c的最佳代码片段网站是啥[重复]