`
jiasongmao
  • 浏览: 670495 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

div+css布局列表元素ul ol li dl dt dd详解

CSS 
阅读更多

dt 和dd中可以再加入 ol ul li和p,理解这些以后,在使用div布局的时候,会方便很多,其实w3c提供了很多元素辅助布局都是有它的用处的,而不尽是div。
块级元素div尽量少用,其实和table一样,嵌套越少越好,它也是会影响速度的!
ol 有序列表。
<ol>
<li>……</li>
<li>……</li>
<li>……</li>
</ol>
表现为:
1……
2……
3……
ul 无序列表,表现为li前面是大圆点而不是123
<ul>
<li>……</li>
<li>……</li>
</ul>
多人容易忽略 dl dt dd的用法
dl 内容块
dt 内容块的标题
dd 内容
以这么写:
<dl>
<dt>标题</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</dl>

对于dl dt dd的应用,请参看网站:http://ria999.com/

分享到:
评论

相关推荐

    div+css布局必了解的列表元素ul ol li dl dt dd详解

    列表元素ul、ol、li、dl、dt和dd是构建内容列表、导航链接和其他有序或无序信息的基石。了解并正确使用这些元素对于创建清晰、可访问且搜索引擎优化友好的网站至关重要。 首先,ul(无序列表)和ol(有序列表)是...

    div+css常用标签.pdf

    6. `dl`, `dt`, `dd`:定义列表,`dl`定义列表,`dt`定义术语,`dd`定义术语的解释。 7. `a`:超链接,用于创建链接到其他资源的元素。 8. `img`:图像标签,用于在网页中插入图片。 9. `h1`至`h6`:标题标签,用于...

    div+css常用标签.docx

    6. `dl`, `dt`, `dd`:定义列表,`dl`是容器,`dt`定义术语,`dd`定义术语的解释。 7. `a`:超链接标签,用于链接到其他网页或锚点。 8. `img`:图像标签,用于插入图片。 9. `h1` 至 `h6`:标题标签,从一级到六级...

    网页常用的DIV+CSS选项卡

    ### 网页常用的DIV+CSS选项卡设计与实现 #### 一、概述 在前端网页开发中,选项卡(Tabs)是一种常见的交互组件,它能够有效地组织和展示多个相关但不连续的信息区块,帮助用户在不同的内容块之间进行切换。这种...

    随手记的div+css的小抄代码

    - `ul,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p{padding:0;margin:0;}`: 对列表、标题、表单元素及段落等设置了默认无边距的样式,确保这些元素不会自动添加额外的空间。 - `ul{list-style:none;}`: 清除了列表项前...

    HTMLl5+CSS总结笔记.docx

    - **自定义列表**:`&lt;dl&gt;&lt;dt&gt;Term&lt;/dt&gt;&lt;dd&gt;Description&lt;/dd&gt;&lt;/dl&gt;`。 - **表格标签**: - 基本结构:`&lt;table&gt;&lt;tr&gt;&lt;td&gt;Cell 1&lt;/td&gt;&lt;td&gt;Cell 2&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;`。 - 表头:`&lt;th&gt;`。 - 表格属性:`...

    贵美商城商品详细信息

    4. **定义列表(div-dl-dt-dd)结构的应用** - **应用场景**:适合用于展示带有标题和描述的信息,例如商品详情页中的特性介绍。 - **特点**:通过dt(定义项)和dd(定义描述)来区分标题和内容,使信息结构更加清晰。 ...

    HTML+CSS-总结

    - **定义列表**:`&lt;dl&gt;`、`&lt;dt&gt;`(定义术语)和`&lt;dd&gt;`(定义描述),用于定义术语及其描述。 #### 三、CSS 概述 - **CSS (Cascading Style Sheets)**:层叠样式表,用于控制网页的表现形式,如颜色、布局和字体等...

    html+CSS教程

    - **`&lt;dl&gt;`**、**`&lt;dt&gt;`**、**`&lt;dd&gt;`**:定义列表、定义术语、定义描述。 - **`&lt;h1&gt;`** - **`&lt;h6&gt;`**:标题标签,其中 `&lt;h1&gt;` 最重要,用于页面主标题,`&lt;h2&gt;` 用于副标题,以此类推。 - **`&lt;form&gt;`**:用于创建表单...

    DIV布局兼容

    - `dl`, `dt`, `dd`:定义列表,`dl`是定义列表的容器,`dt`表示定义术语,`dd`是术语的解释。 3. **DIV布局技巧** - **孙氏兼容法则**: - **有浮必清**:浮动元素后应跟随一个清除浮动的元素,以避免布局混乱...

    通用的css reset

    body, div, p, form, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; } ``` - 清除多个元素的内外边距,包括常见的块级元素、表单元素等。 - 目的是消除浏览器之间的默认内外边距差异...

    CSS基础标签.md

    - **自定义列表 (`dl`, `dt`, `dd`)**:`dl` 标签定义描述列表,`dt` 定义列表项名称,`dd` 定义描述细节。 - **无序列表 (`ul`, `li`)**:`ul` 标签定义无序列表,`li` 定义列表项。 - **有序列表 (`ol`, `li`)**:...

    HTML5培训技术分享 定位属性、列表的高级应用及带有图片列表的网页制作(下)

    本节将介绍如何使用无序列表 `&lt;ul&gt;`、有序列表 `&lt;ol&gt;` 和定义列表 `&lt;dl&gt;` 来创建更复杂的结构。 ##### 1. 无序列表与有序列表 - **无序列表** (`&lt;ul&gt;`): 适用于创建不需要排序的项目列表。 - **有序列表** (`&lt;ol&gt;`)...

    2008年腾讯实习生招聘设计类网页重构组岗位公开试题

    - 定义列表:`&lt;dl&gt;&lt;dt&gt;定义术语&lt;/dt&gt;&lt;dd&gt;定义描述&lt;/dd&gt;&lt;/dl&gt;` - CSS缩写: - a) `border:1px solid #000` - b) `background:url(background.gif) fixed no-repeat #f00` - c) `font:italic 1em "Lucida Grande...

    CSS基本规范

    dd, dl, dt, li, ol, ul, fieldset, form, label, legend, input, select, textarea, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; } ``` 通过这种方式,可以确保不同浏览器之间的...

    css reset初始化设置.docx

    dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, ...

    10个常用CSS代码片段(DOC文档)

    dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; ...

Global site tag (gtag.js) - Google Analytics