首页综合练习网站首的整体布局商品分类版块

网站布局时间:2021-02-12 阅读:()

掌握使用DIV+CSS页面布局的方法实现网站首页。

实验所需软件

Ultra Edit

实验内容

1练习——贵美首页的整体布局。

需求说明

重新实

现贵美

2、练习贵美商品分类版块。

需求说明在上一练习基础上根据提供的素材重新实现贵美左边的商品分类版块。如

图

1.2所示。

 1 实现页面HTML吉构

2实现CSS

1练习一一贵美首页的整体布局代码如下:<html>

<head>

<title>box</title>vstyle type="text/css">

★container

{width:980;margi n:0px auto;

实

验 }

内

容 #header

由

学 {

生

填 height:136px;

backgro un d:#ccc;

}

#ma in1

{float: left;height:300px;width:240px;backgro un d:gree n;

#mai n2

{float: left;height:300px;width:500px;backgro un d:blue;}

#mai n3{float:right;height:300px;width:240px;backgro un d:yel low;

}

#footer

{clear:both;height:136px;backgro un d-color:#ccc;}v/style>

</head>

<div id="header">header

</div>

<divid="mai n1">

商品分类cat

</div>

<divid="mai n2">

内容content 

</div>

<divid="mai n3">右侧sidebar  </div><d iv id="footer">footer

</div>

v/div>v/body><html>

运行结果如下:rjEsder

2、练习- -贵美商品分类版块代码如下:

<html>

<head>

#container{width:1000px;margi n:auto;

width:100%; height:136px;backgro un d:url(images/logo.jpg)

#sidebar{ width:20%;

#foote r{width:100%; height:100px; backgrou nd:#ccc;

}v/style>

</head>

<body>

<divclass="me nu">

<ul>

帮助中心</a>v/l i>

</ul>v/div>

</div>

展开全文

首页综合练习网站首的整体布局商品分类版块相关文档

LOCVPS洛杉矶CN2线路KVM上线,洛杉矶/香港云地/香港邦联7折

LOCVPS发来了新的洛杉矶CN2线路主机上线通知，基于KVM架构，目前可与香港云地、香港邦联机房XEN架构主机一起适用7折优惠码，优惠后最低美国洛杉矶CN2线路KVM架构2GB内存套餐月付38.5元起。LOCPVS是一家成立较早的国人VPS服务商，目前提供洛杉矶MC、洛杉矶C3、和香港邦联、香港沙田电信、香港大埔、日本东京、日本大阪、新加坡、德国和荷兰等机房VPS主机，基于KVM或者XEN架构。...

vdsina：俄罗斯VPS(datapro)，6卢布/天，1G内存/1核(AMD EPYC 7742)/5gNVMe/10T流量

今天获得消息，vdsina上了AMD EPYC系列的VDS，性价比比较高，站长弄了一个，盲猜CPU是AMD EPYC 7B12（经过咨询，详细CPU型号是“EPYC 7742”）。vdsina，俄罗斯公司，2014年开始运作至今，在售卖多类型VPS和独立服务器，可供选择的有俄罗斯莫斯科datapro和荷兰Serverius数据中心。付款比较麻烦：信用卡、webmoney、比特币，不支持PayPal...

VPS云服务器GT线路,KVM虚vps消息CloudCone美国洛杉矶便宜年付VPS云服务器补货14美元/年

近日CloudCone发布了最新的补货消息，针对此前新年闪购年付便宜VPS云服务器计划方案进行了少量补货，KVM虚拟架构，美国洛杉矶CN2 GT线路，1Gbps带宽，最低3TB流量，仅需14美元/年，有需要国外便宜美国洛杉矶VPS云服务器的朋友可以尝试一下。CloudCone怎么样？CloudCone服务器好不好？CloudCone值不值得购买？CloudCone是一家成立于2017年的美国服务器...