DIV及BODY 高宽边距属性图解

最新推荐文章于 2023-05-20 17:07:21 发布
原创 最新推荐文章于 2023-05-20 17:07:21 发布 · 474 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文通过一张直观图详细解析了页面DIV及BODY元素的各种属性，包括高宽边距等，旨在帮助读者更好地理解和应用这些属性。

由于页面DIV及BODY 设置高宽边距 等属性众多且易混淆，甚至有的属性还不清楚其作用。

遂找了个直观图方便大家交流和学习(如下所示)：

 
 
 
阅读(453) | 评论(0) | 转发(0) |
0

上一篇：一般住宅小区的容积率多少比较合适

下一篇：session介绍

相关热门文章
给主人留下些什么吧！~~
评论热议
我行我速
关注
jquery js 设置 div 的内容，给 div 添加一个属性
Dove言和
05-19 7834
设置 div 的内容的写法： jquery 的写法: $( "#div1" ).html( "aa" ); // 将 div1 元素里面的 html 赋值为字符串 "aa"，不能用 $( "#div1" ).val( "aa" ); js 的写法:document.getElementById("div1").innerHTML = "aa"; 给 d...
HTML+CSS扩展内容：div盒子隐藏常用的属性display和visibility的区别
王迪
02-17 2511
知识点：盒子的隐藏属性display和visibility 1、display属性和visibility属性的相同点：           display和visibility都是CSS属性，都可以控制盒子的显示和隐藏。   2、display属性和visibility属性的不同点：        （1）属性取值不一样： display属性的取值有：block和none。其中block...
DIV的边距属性在Chrome和IE中的区别
weixin_30493401的博客
11-06 165
突然间，在Chrome下看起来很整齐的布局，在IE下变成一团糟。为了找出原因，我改动了div的background-color属性。最后，发现同一个DIV的宽度在IE和Chrome下却不一样。这大晚上的，真是怪吓人滴！之后，做了个测试。当： Css代码 div1 { width:960px; margin:0px; padding:0px;...
css边距属性
07-09 554
一、内边距：边框和内容之间的距离 1、格式 1.1非连写 padding-top：5px； padding-right：5px； padding-bottom：5px； padding-left：5px；1.2连写 padding：上 右 下 左 （省略规律同边框属性） 注意点：给变迁设置内边距后，标签占有的高度和宽度会发生变化；内边距也会有背景颜色二、外边距：标签与标签之间的距
div+css - body边距
gdfjhc的博客
02-22 857
div+css - body边距
div默认外边距是多少_css外边距属性有哪些？
weixin_39747334的博客
12-21 206
css样式中的margin也就是css中外边距外间距属性，顾名思义，就是控制div块或者各元素之间上下左右的距离，显然margin在css中的作用不容小觑。本篇文章就给新手小白介绍关于cssmargin属性的具体用法。希望对大家有所帮助。下面我们通过具体的代码示例详细解说css中margin属性即css外边距属性的具体用法代码示例：css中的margin属性使用示例.demo{width:300p...
div属性
拼命三郎
01-15 3236
div属性 一、常用样式属性 1、width、height：分别用来设置div的宽度和高度； 2、padding：用来设置内边距，即内部子元素到div的边界的距离；       该属性有四个值分别为：padding-top、padding-right、padding-bottom、padding-left；顺序不可变，但可省略其中的某       个。可以用上边的方法分开单独设值，也可以
html综述一 -- jQuery基础使用（动态在body中创建div节点）
weixin_33904756的博客
04-11 2702
1 动态创建节点1-1 通过jsp最原生的方法来创建节点详细说明请查看点击此处查看<!DOCTYPEhtml> <html> <head> <metahttp-equiv="Content-type"content="text/html;charset=utf-8"/> <title>这是使用jqu...
前端实例知识点-多个并行的DIV实现高度一致
ccsawcc的博客
01-11 1万+
博客前言： 做为一个程序员，在复杂的工作环境中总要学着去承担更多的责任，和接触更广泛的知识。然而在接触新区域时，一个小白总是为自己能钻研出一点点东西感到十分兴奋，为了让这份成就感附属的知识点留给自己，决定记录下来这些小知识点（敲黑板，期末要要考...）。可以方便以后查阅，还有可能分享给遇到同样问题的同学们。 前端知识点（一）：多个并行的DIV实现高度一致 我的前端启蒙来源于工作初期的
边框美学：HTML border属性详解
a451319296的博客
05-20 8139
本文介绍了HTML的border属性，包括其语法和常见的属性值。通过边框宽度、样式和颜色的设置，可以实现丰富多彩的HTML元素样式。同时，也提供了使用内联样式、内部样式表和外部样式表的方式来使用border属性的方法。读者可以通过本文全面了解HTML border属性的用法和应用场景，从而为自己的网站设计提供更加美观的视觉效果。
html怎么修改边距,html怎么设置div边距
weixin_31258847的博客
06-03 6458
html怎么设置div边距,外边,盒子,属性,元素,距离html怎么设置div边距易采站长站，站长之家为您整理了html怎么设置div边距的相关内容。方法：1、使用margin相关属性给div设置外边距(div盒子外围四周的距离)；2、使用padding相关属性给div设置内边距(div盒子中装载的内容到盒子边缘(边框)之间距离)。本教程操作环境：windows7系统、CSS3&&...
浏览器有时会给body标签默认边距。
qq_33912978的博客
09-14 552
浏览器有时会给body标签默认边距。
DIV的常用属性
长江量子
11-07 1920
一、常用属性 1、Height:设置DIV的高度；Width:设置DIV的宽度。 2、margin:用于设置DIV的外延边距，也就是到父容器的距离。margin:后面跟有四个距离分别为到父容器的上-右-下-左边的距离；margin: [top][right][bottom][left]可以分别设置：margin-left:到父容器左边框的距离；margin-right:到父容器右边框的距离；m
js获取元素div相对body的距离
热门推荐
jazywoo_在路上
08-15 1万+
如何取到页面中任意某个Html元素与body元素之间的偏移距离？ offsetTop和offsetLeft 这两个属性,IE 、Opera和Firefox对它俩的解释存在差异： IE5.0+ 、Opera8.0+：　offsetTop和offsetLeft 都是相对父级元素 Firefox1.06： offsetTop和offsetLeft 都是相对于body元素 因此：
DIV布局中MARGIN属性清除body体的外边距
RU小冰的专栏
07-12 9732
BODY体默认的页面外边距是有一点距离的，加了margin:0px; 后外边距看不见了，个人理解BODY体MARGIN属性比较特别，是指内BODY体内文本的外边距。   DIV+CSS页面布局margin    body{ background:#FF0000; margin:0
如何将div盒子设置和浏览器一样的宽度和高度？附页面开关灯案例
weixin_46353030的博客
04-07 7490
今天做一个页面开关灯案例的时候遇见了以下问题： 不知道怎么将div盒子设置成和浏览器一样的宽度和高度； 开关灯按钮被覆盖了； 第一个问题的解决方案如下 <style> /* 将div的宽度和高度设置为100% */ div { width: 100%; height: 100%; background-color: #fff; } /* 同时还要修改body和html的宽度和高度 */ body,
html怎么使div和上面距离为0,img div 间距设为0，图片和DIV间距的调整
weixin_34522296的博客
06-29 1352
一、如何定义高度很小的容器？在IE6下没法定义小高度的容器，是由于有一个默认的行高。列举2种解决方案：overflow:hidden | line-height:0二、图片下方出现几像素的空白间隙？这个也有多种解决方案，如将img定义为display:block,或定义父容器为font-size:0，我的更推荐使用vertical-align的方式，它的值能够是text-top | text-bo...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值