Skip to content
Snippets Groups Projects
Commit d922f569 authored by wyl's avatar wyl
Browse files

hk-change01

parent 841af6d3
No related branches found
No related tags found
1 merge request!9C23096663 submit final
Hide whitespace changes
Inline Side-by-side
css/index.css
+ 21
− 208
View file @ d922f569
.top{
background:#fefefe;
.top {
background: #fefefe;
}
.title{
background: url(../image/logo.gif) no-repeat;
width: 247px;
height: 56px;
.title {
width: 130px;
height: 75px;
margin: 23px 0;
background-color: #f75a53;
color: yellow;
}
.title h1{
font-size: 0px;
}
.saying img{
margin:36px 24px 33px 39px;
.saying img {
margin: 36px 24px 33px 39px;
}
.saying2{
width: 88px;
.saying2 {
width: 300px;
height: 39px;
margin-top: 20px;
}
.saying2 p{
.saying2 p {
font-size: 14px;
color: #989a99;
font-style: italic;
font-style: italic;
line-height: 2;
}
.nav1 li{
.nav1 li {
padding: 30px 16px;
color: #000100;
float: left;
margin-top: 30px;
}
.nav1 li:hover{
background-color:#f75a53 ;
color: #fdfde3;
}
.banner{
overflow: hidden;
position: relative;
height: 460px;
}
.banner img{
position: absolute;
left: calc(50% - 720px);
}
.partner{
height: 385px;
background-color: #f7f7f7;
}
.title2{
height:123px ;
}
.title2 h3,
.title3 h3,
.title4 h3{
font-size: 22px;
text-align: center;
padding-top: 39px;
padding-bottom: 18px;
}
.title2 p,
.title3 p,
.title4 p{
font-size: 14px;
text-align: center;
padding-bottom: 28px;
}
.title2 p,
.title4 p{
color: #999999;
}
.pimg ul li{
float: left;
border: 1px solid #ededed;
width: 188px;
height: 100px;
}
.pimg ul li img{
text-align: center;
vertical-align: middle;
padding-top: 30px;
padding-left: 20px;
}
.title3{
margin-bottom: 108px;
}
.advantage{
height: 540px;
background-color: #1a1b1f;
}
.title3 h3{
color: #fffdfe;
}
.title3 p{
color: #fffdfe;
}
.advantages ul li:before{
content: "";
display: block;
background:url(../image/img01.png);
width: 130px;
height: 130px;
position: absolute;
left: 105px;
top: -65px;
}
.advantages ul .two:before{
background-position-y:-162px ;
}
.advantages ul .third:before{
background-position-y:-324px ;
}
.advantages ul{
margin-left: -58px;
}
.advantages li{
width: 340px;
height: 260px;
background-color: #d1d1d1;
float: left;
margin-left: 58px;
position: relative;
}
.advantages ul li h4{
font-size: 18px;
color: #e54142;
font-weight: normal;
padding-bottom: 20px;
text-align: center;
padding-top: 96px;
}
.advantages ul li p{
font-size: 12px;
line-height: 30px;
width: 252px;
padding: 0px 45px 28px;
}
.nav2 ul{
margin-left: 156px;
margin-top: 16px;
}
.nav2 li{
color: #fdfffe;
height: 40px;
width: 200px;
float: left;
line-height: 40px;
text-align: center;
background-color: #666666;
position: relative;
}
.nav2 li:hover{
.nav1 li:hover {
background-color: #f75a53;
color: #fdfde3;
}
.nav2 li:hover:after{
content: "";
display: block;
border: 10px solid transparent;
border-top-color: #f75a53;
width: 0;
position: absolute;
left: 94px;
}
.picture ul{
margin-left: -31px;
}
.picture li{
float: left;
margin-left: 30px;
margin-top: 30px;
}
.news{
margin-right: 60px;
margin-top: 95px;
}
.news dl{
float: left;
margin-right: 60px;
width: 320px;
}
.news dl dt{
font-size: 18px;
color: #000000;
font-weight: bold;
margin-bottom: 30px;
}
.news dl dd{
font-size: 12px;
line-height: 30px;
}
.news dl dd span{
float: right;
color: #8b8786;
line-height: 30px;
}
.news a{
color: #8b8786;
}
.news img{
margin-top: 26px;
}
.bottom{
margin-top: 44px;
height: 138px;
background-color:#363636 ;
}
.lianjie{
padding-top: 28px;
}
.bottom p{
text-align: center;
box-sizing: border-box;
font-size: 12px;
color:#797979 ;
line-height: 30px;
}
.bottom a{
color: #797979;
}
.bottom span{
margin: auto 10px;
}
\ No newline at end of file
css/reset.css
+ 1
− 1
View file @ d922f569
......@@ -30,4 +30,4 @@ img{
}
.right{
float: right;
}
\ No newline at end of file
}
html/index.html
+ 62
− 144
View file @ d922f569
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/index.css">
<link rel="stylesheet" href="../css/email.css">
<link rel="stylesheet" href="../css/common.css">
</head>
<body>
<div class="top safe">
<!-- title -->
<!-- title -->
<div class="title left">
<h1>麦田国际</h1>
<h1>Extreme Ironing</h1>
</div>
<!-- 企业名言 -->
<div class="saying left">
<img src="../image/l.gif" alt="渐变竖线">
<!-- w23px -->
</div>
<div class="saying2 left">
<p>奉行卓越品质则可拥抱未来</p>
<p>Extreme ironing (also called EI) is an extreme sport in which people take ironing boards to remote
locations and iron items of clothing. </p>
</div>
<!-- 导航菜单1 -->
<!-- nav -->
<div class="nav1 right">
<ul>
<li>网站首页</li>
<li>关于我们</li>
<li>新闻资讯</li>
<li>成功案例</li>
<li>尊享服务</li>
<li>招商加盟</li>
<li>联系我们</li>
</ul>
</div>
</div>
<!-- 轮播图 -->
<div class="banner safe">
<img src="../image/banner.gif" alt="轮播图">
</div>
<!-- 战略合作 -->
<div class="partner safe">
<!-- 小标题 -->
<div class="title2">
<h3>战略合作 Strategic partners</h3>
<p>真诚、共嬴、无微不至</p>
</div>
<!-- 合作伙伴 -->
<div class="pimg">
<ul>
<li><img src="../image/partner/dangdang.gif" alt="当当"></li>
<li><img src="../image/partner/tmall.gif" alt="天猫"></li>
<li><img src="../image/partner/jd.gif" alt="京东"></li>
<li><img src="../image/partner/weibo.gif" alt="微博"></li>
<li><img src="../image/partner/weipinhui.gif" alt="唯品会"></li>
<li><img src="../image/partner/mengbasha.gif" alt="梦芭莎"></li>
<li><img src="../image/partner/vanke.gif" alt="万科"></li>
<li><img src="../image/partner/hengda.gif" alt="恒大集团"></li>
<li><img src="../image/partner/green.gif" alt="绿地集团"></li>
<li><img src="../image/partner/garden.gif" alt="碧桂园"></li>
<li><img src="../image/partner/baoli.gif" alt="保利地产"></li>
<li><img src="../image/partner/longhu.gif" alt="龙湖地产"></li>
</ul>
</div>
</div>
<!-- 我们的优势 -->
<div class="advantage">
<div class="title3">
<h3>我们的优势 Our Advantages</h3>
<p>创独一无二的设计，造国际品质的产品，行无微不至的服务</p>
</div>
<!-- 3个小内容 -->
<div class="advantages safe">
<ul>
<li> <h4>我们的设计our Design</h4>
<p>从实地到方案敲定再到设计出图，每一步都有优秀的设计团队全程跟踪，为您打造出最合适的作品是最诚恳的义务。</p>
</li>
<li class="two">
<h4>我们的设计our Design</h4>
<p>从实地到方案敲定再到设计出图，每一步都有优秀的设计团队全程跟踪，为您打造出最合适的作品是最诚恳的义务。</p>
</li>
<li class="third">
<h4>我们的设计our Design</h4>
<p>从实地到方案敲定再到设计出图，每一步都有优秀的设计团队全程跟踪，为您打造出最合适的作品是最诚恳的义务。</p>
</li>
<li>index</li>
<li>about us</li>
<li>news</li>
<li>order us</li>
<li>contact us</li>
<li>ask us</li>
<li>contact us</li>
</ul>
</div>
</div>
<!-- 成功案例 -->
<div class="successful safe">
<!-- 标题 -->
<div class="title4">
<h3>成功案例Successful Case</h3>
<p>始终以建设温馨、和谐的家园,提升您的居家生活品味为己任。</p>
<div class="top1">
</div>
<!-- 导航菜单 -->
<div class="nav2">
<ul>
<li>服务行业</li>
<li>教育行业</li>
<li>房产行业</li>
<li>能源行业</li>
</ul>
<div >
<table id="etable">
<thead>
<td class="head" style="width: 204px;">name</td>
<td class="head" style="width: 176px;">club</td>
<td class="head" style="width: 190px;">address</td>
<td class="head">updatetime</td>
</thead>
<tbody>
<tr>
<td>run</td>
<td>outside</td>
<td>guerrillamail.com/zh/</td>
<td>2024-10-10</td>
</tr>
<tr>
<td>run</td>
<td>outside</td>
<td>guerrillamail.com/zh/</td>
<td>2024-10-10</td>
</tr>
<tr>
<td>run</td>
<td>outside</td>
<td>guerrillamail.com/zh/</td>
<td>2024-10-10</td>
</tr>
<tr>
<td>run</td>
<td>outside</td>
<td>guerrillamail.com/zh/</td>
<td>2024-10-10</td>
</tr>
<tr>
<td>run</td>
<td>outside</td>
<td>guerrillamail.com/zh/</td>
<td>2024-10-10</td>
</tr>
</tbody>
</table>
</div>
<!-- 图片 -->
<div class="picture clearfix">
<ul>
<li><img src="../image/images/new (1).gif" alt=""></li>
<li><img src="../image/images/new (2).gif" alt=""></li>
<li><img src="../image/images/new (3).gif" alt=""></li>
<li><img src="../image/images/new (4).gif" alt=""></li>
<li><img src="../image/images/new (5).gif" alt=""></li>
<li><img src="../image/images/new (6).gif" alt=""></li>
</ul>
</div>
<!-- 新闻 -->
<div class="news safe clearfix">
<dl>
<dt>公司新闻Company News</dt>
<dd><a href="#">款应用程序从设计到切图过程全方位揭秘</a><span>10-29</span></dd>
<dd><a href="#">关于移动端设计工作者必备相关素质</a><span>10-29</span></dd>
<dd><a href="#">移动产品经理必须了解产品的体验进化设</a><span>10-29</span></dd>
<dd><a href="#">IOS分析的APP分析路径</a><span>10-29</span></dd>
<dd><a href="#">指尖上的世界杯看国内新闻客户端功能剖</a><span>10-29</span></dd>
<dd><a href="#">更好的方式来引导用户为应用程序应用打分</a><span>10-29</span></dd>
<dd><img src="../image/按钮.gif" alt=""></dd>
</dl>
<dl>
<dt>行业新闻Industy News</dt>
<dd><a href="#">拿什么拯救你“尴尬”的UI界面(二)</a><span>10-29</span></dd>
<dd><a href="#">当今的移动搜索产品为什么都是那么的难</a><span>10-29</span></dd>
<dd><a href="#">看看菩名天气类应用程序的7条设计经验</a><span>10-29</span></dd>
<dd><a href="#">指尖上的新体验移动互联时代的世界杯</a><span>10-29</span></dd>
<dd><a href="#">微信购物电商去中心化之路</a><span>10-29</span></dd>
<dd><a href="#">移动互联网APP应用的10项设计原则概述</a><span>10-29</span></dd>
<dd><img src="../image/按钮.gif" alt=""></dd>
</dl>
<dl>
<dt>媒体报道Media reports</dt>
<dd><a href="#">30个纯css动画代码片段和效果演示</a><span>10-29</span></dd>
<dd><a href="#">W创始人3水主题演讲PPT限光</a><span>10-29</span></dd>
<dd><a href="#">20个简洁畅快的“全景式”网页设计欣赏</a><span>10-29</span></dd>
<dd><a href="#">30个响应式WordPress主题</a><span>10-29</span></dd>
<dd><a href="#">15个404网页出错创忘设计欣堂</a><span>10-29</span></dd>
<dd><a href="#">—组简洁大气的中文字体设计欣赏</a><span>10-29</span></dd>
<dd><img src="../image/按钮.gif" alt=""></dd>
</dl>
</div>
</div>
<!-- 页眉 -->
<div class="bottom">
<p class="lianjie">
<a href="#">网站首页</a><span>|</span>
<a href="#">关于我们</a><span>|</span>
<a href="#">产品展示</a><span>|</span>
<a href="#">客户案例</a><span>|</span>
<a href="#">客帮助中心</a><span>|</span>
<a href="#">解决方案</a><span>|</span>
<a href="#">联系我们</a>
</p>
<p>Copyright &copy; 2002-2015上海机械设备服务有限公司版权所有Power by DedeCms</p>
<p>电话:15918779820 E-mail : 89898981@qq.com地址:上海市沙河广园东路1858新天地服装城</p>
</div>
</body>
</html>
\ No newline at end of file
</html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment