时间:2021-07-01 10:21:17 帮助过:150人阅读
<div> 可定义文档中的分区或节(division/section)。
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>,那么该标签的作用会变得更加有效。
用法:
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。
不必为每一个 <div> 都加上类或 id,虽然这样做也有一定的好处。
可以对同一个 <div> 元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。
提示和注释:
注释:<div> 是一个块级元素,也就是说,浏览器通常会在 div 元素前后放置一个换行符。
提示:请使用 <div> 元素来组合块级元素,这样就可以使用样式对它们进行格式化。
div的属性
主要设置如下:
overflow(溢出控制):visible(默认,可见)、auto(自动)、scroll(显示滚动条);
width(宽度):数值;
height(高度):数值;
color(字体颜色):色彩代码;
font-size(字体大小):数值;
line-height(行高):数值;
border(边框):宽度、类型和颜色,类型主要支持以下几种:none,dotted,dashed,solid,double,groove,ridge,inset,window-inset,outset;
font-weight(字体粗细):normal、bold、bolder、lighter;
font-family(字体类型):Arial、Tahoma、Verdana、仿宋_GB2312、黑体、楷体_GB2312、隶书、宋体、幼圆;
background(背景颜色):色彩代码;
scrollbar-base-color,scrollbar-face-color,scrollbar-track-color,scrollbar -darkshadow-color,scrollbar-highlight-color,scrollbar-shadow-color,scrollbar -3dlight-color,scrollbar-arrow-color(滚动条各部分的颜色):色彩代码;
filter:chroma(COLOR=转换成透明的颜色)(chroma过滤器):色彩代码,该颜色将转换成透明效果;
word-break(断字):normal(默认,正常断字)、keep-all(严格不断字)、break-all(严格断字);
direction(文字方向):ltr(默认,从左向右)、rtl(从右向左)。
HTML中的Div分区属性
基本属性:width, height, left, top, background-color(当设置为transparent时表示透明)
2、定位属性:position: absolute/relative
absolute时,位置固定;relative时,位置会随着内容的实际情况进行浮动
3、显示属性:display: block/none
block为默认状态,表示显示;none为隐藏
4、优先属性:z-index:n
n表示一个整数(正负均可),有多个Div时n越大,则越靠前显示;
z-index可以理解为z轴的坐标(x,y轴控制左右、上下方位,z轴控制层叠div的前后方位)
只有用绝对定位(position:absolute)时,属性z-index才起作用;
未设置绝对定位(position:absolute)的div,其z-index永远为0;
未设定优先属性(z-index)的div,按照声明的顺序层叠,后声明的盖住先声明的,如果有两个Div属于父子关系,则子div覆盖父div;
5、透明属性:opacity:0.3;(firefox专用);filter:alpha(opacity=30)(IE专用)
两者一起用的时候就将两种主流浏览器都兼容了;上面例子是将Div的透明度设置为30%,可以看出两者的设置稍有不同;Div的文本与背景色均能被透明化!
div现在一般网页的布局都是使用的div+css来布局,
div的话,就是通过
<div> <div><p></p></div> </div>
div的嵌套使用来完成整个网页的布局,你可以将div理解成一个一个的块,然后在div块中写入P等等标签,然后再通过CSS来修饰就行了,如高度,宽度,背景。。。都是可以的
<div></div>
就把DIV看成一个 纯净的箱子吧.....啥属性都没有....
默认宽度100%
高度0
高度是 按DIV里的 内容而变高
也可以在 CSS里 设置 宽高....
DIV就是 典型的 标签.. P UL LI 等 标签
用DIV 都能做...
它们都是 以DIV的 基础+CSS 而形成的...
以上就是html中<div>标签的用法与定义的详细内容,更多请关注Gxl网其它相关文章!