css样式div,css样式display

css+div中div是什么啊,怎么用啊

HTML div 标签

1、定义和用法

div 可定义文档中的分区或节（division/section）。

div 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。

如果用 id 或 class 来标记 div，那么该标签的作用会变得更加有效。

2、用法

div 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上，换行是 div 固有的唯一格式表现。可以通过 div 的 class 或 id 应用额外的样式。

不必为每一个 div 都加上类或 id，虽然这样做也有一定的好处。

可以对同一个 div 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。

3、实例

文档中的一个部分会显示为绿色：

div style="color:#00FF00"

  h3This is a header/h3

  pThis is a paragraph./p

/div

4、浏览器支持

所有主流浏览器都支持 div 标签。

5、HTML 与 XHTML 之间的差异

在 HTML 4.01 中，div 元素的 "align" 属性不被赞成使用。

在 XHTML 1.0 Strict DTD 中，div 元素的 "align" 属性不被支持。

6、提示和注释：

注释：div 是一个块级元素，也就是说，浏览器通常会在 div 元素前后放置一个换行符。

提示：请使用 div 元素来组合块级元素，这样就可以使用样式对它们进行格式化。

7、案例分析

body

 h1NEWS WEBSITE/h1

  psome text. some text. some text.../p

  ...

 div class="news"

  h2News headline 1/h2

  psome text. some text. some text.../p

  ...

 /div

 div class="news"

  h2News headline 2/h2

  psome text. some text. some text.../p

  ...

 /div

 ...

/body

案例释义：正如您看到的，上面这段 HTML 模拟了新闻网站的结构。其中的每个 div 把每条新闻的标题和摘要组合在一起，也就是说，div

为文档添加了额外的结构。同时，由于这些 div 属于同一类元素，所以可以使用 class="news" 对这些 div 进行标识，这么做不仅为

div 添加了合适的语义，而且便于进一步使用样式对 div 进行格式化，可谓一举两得。

8、可选的属性

9、标准属性

10、事件属性

相关问答

Q1: 怎样定义一个DIV里的元素的CSS样式

有三种常用方式：1、通过id 例：style#test{color:red;}/stylediv id="test" test/div

2、通过类名 例：style.test{color:blue;}/stylediv class="test" test/div

3、直接放在div标签里 例：div style="color:purple" test/div

Q2: css样式如何控制div到最顶层

1、新建一个html文件，命名为test.html

2、在test.html文件内，使用css设置页面所有的div宽度为300px，高度为300px，div的位置为绝对定位。

3、在test.html文件内，创建三个div，并用文字标识，分别为底层div、中层div、最顶层div。

4、在test.html文件内，分别给三个div设置class属性为one、two、three，用于下面对类名进行样式设置。

5、在css标签内，设置类名为one的div样式，设置其背景颜色为红色，距离页面左边缘为0，距离页面上边缘为0，同时使用z-index设置其层级为1。

6、在css标签内，设置类名为two的div样式，设置其背景颜色为黄色，距离页面左边缘为50px，距离页面上边缘为50px，同时使用z-index设置其层级为2，即在类名为one的div的上面。

7、在css标签内，设置类名为three的div样式，设置其背景颜色为粉红色，距离页面左边缘为100px，距离页面上边缘为100px，同时使用z-index设置其层级为3，即在页面三个div中的最顶层。

8、在浏览器打开test.html文件，查看实现的层级效果。

Q3: css样式 div居中 怎样写

水平居中可以使用margin:0px auto;实现（盒子需要定义宽度）；

垂直居中有一下四种方式：

方法1：

.parent {

width:800px;

height:500px;

border:2px solid #000;

position:relative;

}

.child {

width:200px;

height:200px;

margin: auto;

position: absolute;

top: 0; left: 0; bottom: 0; right: 0;

background-color: red;

}

方法2：

.parent {

width:800px;

height:500px;

border:2px solid #000;

display:table-cell;

vertical-align:middle;

text-align: center;

}

.child {

width:200px;

height:200px;

display:inline-block;

background-color: red;

}

方法3：

.parent {

width:800px;

height:500px;

border:2px solid #000;

display:flex;

justify-content:center;

align-items:center;

}

.child {

width:200px;

height:200px;

background-color: red;

}

方法4：

.parent {

width:800px;

height:500px;

border:2px solid #000;

position:relative;

}

.child {

width:300px;

height:200px;

margin:auto;

position:absolute;/*设定水平和垂直偏移父元素的50%，再根据实际长度将子元素上左挪回一半大小*/

left:50%;

top:50%;

margin-left: -150px;

margin-top:-100px;

background-color: red;

}

Q4: 怎么定义1个DIV的CSS样式？

加入样式可以有两种途径，1是适用ID，2是适用CLASS

如果DIV的ID是AA那么代码会显示为div id="aa"/div

class则为div class="aa"/div

那么CSS应该写在哪里呢

如果页面是引入了CSS文件，那么你就找到CSS文件中

id的定义样式格式为#aa{background:red;}

class的定义样式格式为.aa{background:red;}

没错 就是#和.的区别

那么如果没有引入CSS文件应该放在哪里呢

看到页面代码头部有个head标签么

在head和/head之间加入

style#aa{background:red;}/style

即可。

同样也可以写多个

style

#aa{background:red;}

#bb{background:red;}

/style

by--精通css