导航:首页 > 万维百科 > 网页设计用div
网页设计用div
发布时间：2021-01-05 08:59:011、网页设计中DIV有什么作用?
div是用来做网页布局的，一个<div></div>就相当于一个矩形框，可以用id，class来控制它的样式
麻烦采纳，谢谢!
2、请问，网页设计中怎样用div+css进行如下图的分块，谢谢。
如果有成图的话，可以考虑PS切图
手写的话，代码就比较多了
<!DOCTYPE html><html>
<head>
<title>手写代码</title>
<meta charset="utf-8">
<style type="text/css">
*{padding:0;margin: 0;}
.w1260{width: 1260px;margin: 12px auto;margin-top: 0;}
.h-1{border: 1px solid #bbb;height: 120px;}
.h-2{border: 1px solid #bbb;height: 80px;}
.h-3{border: 1px solid #bbb;position: relative;overflow: hidden;}
.h-3 .h3-l{float: left;width: 33%;border-right: 1px solid #bbb;padding:1%;}
.h-3 .h3-l .h3-l1{border: 1px solid #bbb;height: 200px;}
.h-3 .h3-l .h3-l2{border: 1px solid #bbb;height: 200px;margin-top: 12px;}
.h-3 .h3-r{float: right;width: 62.6%;padding: 1%;padding-left: 0;}
.h-3 .h3-r .h3-r1{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;}
.h-3 .h3-r .h3-r1 .h3-r1-l{float: left;height: 80px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r1 .h3-r1-r{float: right;height: 80px;width: 24%;}
.h-3 .h3-r .h3-r2{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;height: 100px;margin-top: 12px;}
.h-3 .h3-r .h3-r3{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;margin-top: 12px;}
.h-3 .h3-r .h3-r3 .h3-r3-l{float: left;height: 200px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r3 .h3-r3-r{float: right;height: 200px;width: 24%;}
.h-4{border: 1px solid #bbb;height: 80px;}
</style>
</head>
<body>
<div class="h-1 w1260"></div>
<div class="h-2 w1260"></div>
<div class="h-3 w1260">
<div class="h3-l">
<div class="h3-l1"></div>
<div class="h3-l2"></div>
</div>
<div class="h3-r">
<div class="h3-r1">
<div class="h3-r1-l"></div>
<div class="h3-r1-r"></div>
</div>
<div class="h3-r2"></div>
<div class="h3-r3">
<div class="h3-r3-l"></div>
<div class="h3-r3-r"></div>
</div>
</div>
</div>
<div class="h-4 w1260"></div>
</body>
</html>
3、求一个网页制作高手用div+css做一个网页布局 急 谢谢！！！！！！！！！！！
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#containt{ height:530px; width:400px; margin:0 auto; border:1px solid #000000;}
#top{ height:100px; width:380px; margin-top:7px; margin-left:9px;}
#top_left{ height:100px; width:138px; float:left; border:1px solid #000000; border-right:none;}
#top_right{ height:100px; width:238px; float:left; border:1px solid #000000;}
#content{ height:50px; width:380px; margin-top:5px; margin-left:9px; border:1px solid #000000;}
#bottom{ height:350px; width:380px; margin-top:5px; margin-left:9px;}
#bom_left{ height:350px; width:138px; float:left; border:1px solid #000000;}
#bom_right{ height:350px; width:235px; float:left; border:1px solid #000000; margin-left:3px;}
.b_r_div{ height:100px; width:68px; margin-left:6px; float:left; margin-top:5px; border:1px solid #000000;}
#b_r_bottom{ height:120px; width:225px; margin-left:5px; float:left; margin-top:5px; border:1px solid #000000;}
</style>
</head>
<body>
<div id="containt">
<div id="top">
<div id="top_left"></div>
<div id="top_right"></div>
</div>
<div id="content"></div>
<div id="bottom">
<div id="bom_left"></div>
<div id="bom_right">
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div id="b_r_bottom"></div>
</div>
</div>
</div>
</body>
</html>
4、网页设计中div是起什么作用的？
div是块状标签，可以把网页分成一块一块的，方便排版，明确层次。
比用table等更好。
5、网页设计div？
DIV (标鉴）+ CSS (层叠样式表)是网站标准（或称“Web标准”) 中的常用术语之一，通常为了说明与HTML网页设计语言中的表格 (Table)定位方式的区别，因为XHTML网站设计标准中，不再使用表格定位技术，而是采用DIV + CSS的方式实现各种定位。使用DIV + CSS设计网站对SEO的影响是显而易见的，由于结构简单，且符合标准
6、网页设计中DIV是什么意思？
在HTML网页源代码中DIV是什么意思，出现很多DIV，究竟有什么作用和功能？
在网页html中查看源代码会看到很多代码，包括DIV、span、h1、b加粗、strong等标签组成。
html中div使用截图一段HTML源代码截图其中包括div span h1标签使用
培训是针对那些有条件的人来说，很多小伙伴更喜欢的是自学。但是一个人自学毕竟力量是有限的，为了让想学习的人可以更好的学习，给大家推荐一个裙，前面是6 5 7，中间是壹 三 七，最后面就是九 0 六，这里有很多想学习的人和你一起交流，也有大牛每天晚上免费教学，想要学习的人都可以加入我们，但是我们只欢迎想学习的人，不是来学习，随便看看的就不要进了。
DIVSPNANH1是什么意思呢？
这些标签是包裹内容作用，有的是起到布局各种各样样式而使用DIV标签，有的是为了内容加粗比如strong标签、表达是标题h1标签。
div作用
让内容包裹在DIV内，实现各式各样的美化，比如对div设置边框，这样内容就区就有边框样式、对div设置字体颜色这样对应DIV内字体就有了各式各样的颜色；对div设置背景颜色或背景图片，这样内容就有了漂亮的css背景。
div标签内使用样式实现各式各样排版，对div设置不同的css样式，实现美工图布局样式。
7、网页设计采用div+css有什么好处？
网页设计采用div+css的好处：
1、div+css有利于搜索引擎爬虫：一般而言相同网页页面html文件table布局字节大于div+css布局的字节，所以可以节约搜索引擎爬虫爬行下载页面内容时间。
2、重构页面修改方便（div+css改版方便）：一般DIV+CSS页面都是html和css文件分开的也就是说一个网页的内容与表现形式的分离，一般修改小小部分的css文件里css样式属性就可以修改真站的样式版面，如背景颜色、字体颜色、网站宽度等具有table不具备的方便性。
3、div+css页面增加网页打开速度：这里是特性决定了他们的性能，因为div+css页面是div的html和css文件分开的，而浏览器打开该网页的时候是同时下载html和css，所以可以提高网页打开速度，而table还有个特性就是浏览器打开的时候必须是浏览器下载以<table>开始,并</table>结束后才显示该块的内容，而div的html是边加载边将内容呈现到浏览器上，div+css网站大大增强用户体验作用。大家都知道网页多等1秒钟都会降低浏览者的等待时间。
8、网页设计 DIV
差不多了 你把图片自己加上就可以了
<!DOCTYPE HTML><html>
<head>
<style type="text/css">
body{background:#000;font-size:12px;}
.header_box{width:700px;height:50px;background:#fff;filter:alpha(opacity:50);opacity:0.5;-moz-border-radius:0 0 10px 10px; -webkit-border-radius:0 0 10px 10px;border-radius:0 0 10px 10px;}
.header_box a,.header_box a i{display:inline-block;*display:inline;*zoom:1;line-height:50px;color:#555}
.header_box a i{border:1px solid red;float:left;margin-top:15px;margin-right:5px;}
.header_box .span1{padding-right:20px;}
.header_box .span2{padding-right:200px;}
.header_box .span3{padding-right:20px;}
.header_box .span1 i{width:20px;height:20px;background:url(../images/email.png) no-repeat;}
.header_box .span2 i{width:20px;height:20px;background:url(../images/phone.png) no-repeat;}
.header_box .span3 i{width:20px;height:20px;background:url(../images/login.png) no-repeat;}
.header_box .span4 i{width:20px;height:20px;background:url(../images/account.png) no-repeat;}
</style>
</head>
<body>
<div class="header_box">
<a href="#" class="span1"><i></i>[email protected]</a>
<a href="#" class="span2"><i></i>0423656655</a>
<a href="#" class="span3"><i></i>Login</a>
<a href="#" class="span4"><i></i>Create an account</a>
</div>
</body>
</html>
与网页设计用div相关的知识
- 网页设计中怎样链接css
- 站长扣除是什么意思
- 农机站长主要表现
- 权威的赣州网站建设
- 大客流值班站长的职责
- 二段煤气炉站长招聘
- 表单在动态网页设计中的作用
- 帝国cms瀑布流模板
- 网站建设功能需求有哪些
- 比较好的图片设计网站有哪些
- cms对接网
- 简单的网页页面设计用什么软件
- 竞选广播站长
- 倾世cms破解
- 鹤壁超限站站长
- 济南产经报站长是什么级别
- 网页设计师能力
- cms是什么牌子的点歌机
- 中国最牛逼的设计网站
- 收费站站长主要职能
- 新浪cms稿源系统指的是
- 400路终点站长鸣路
- 站长工具收入信息
- 魔方小站站长教学视频6
- 朝宋站长爬墙
- 三毛室内设计网站
- 铁路长沙站站长级别
- 网页设计怎样添加flash
- 签名设计好网站
- 广播站站长和大队长
- cms是哪个监控
- 服装设计网站哪个好
- 网站设计计划
- 猫网页设计
- 精通html5网页设计
- 下一站长沙
- 路政副站长年度考核表
- 网站建设技术规范
- 自己设计旅行路线网站
- 谁有电商网站的mongodb设计
- 帝国cms变量标签
- 河南省住房建设厅网站
- 设计装修风格网站
- 上海高端网站建设服
- 新会边检站现任站长
- 福彩站长
- 帝国cms复选框
- 湖南肿瘤医院离哪站长沙城铁近