HTML——列表、块级/内联元素

一、列表

1.无序列表:(点索引)

ul属性type可选值:disc/circle/square(圆实心点/圆空心点/方实心点)

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

2.有序列表:(数字索引)

ol属性type可选值:A/a(默认数字序号/大写字母序号/小写字母序号)

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

3.定义列表:

自定义列表不仅仅是一列项目,而是项目及其注释的组合。

自定义列表<dl>,自定义列表项<dt>,列表项的定义<dd> (显示格式不同)

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

4.列表标签

 

标签描述
<ol> 定义有序列表。
<ul> 定义无序列表。
<li> 定义列表项。
<dl> 定义定义列表。
<dt> 定义定义项目。
<dd> 定义定义的描述。
<dir> 已废弃。使用 <ul> 代替它。
<menu> 已废弃。使用 <ul> 代替它。

 

二、元素类型:

 块元素(block)、内联元素(in-line)

1.块级元素:

  * address - 地址 
  * blockquote - 块引用 
  * center - 举中对齐块 
  * dir - 目录列表 
  * div - 常用块级容易,也是css layout的主要标签 
  * dl - 定义列表 
  * fieldset - form控制组 
  * form - 交互表单 
  * h1 - 大标题 
  * h2 - 副标题 
  * h3 - 3级标题 
  * h4 - 4级标题 
  * h5 - 5级标题 
  * h6 - 6级标题 
  * hr - 水平分隔线 
  * isindex - input prompt 
  * menu - 菜单列表 
  * noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容 
  * noscript - 可选脚本内容(对于不支持script的浏览器显示此内容) 
  * ol - 排序表单 
  * p - 段落 
  * pre - 格式化文本 
  * table - 表格 
  * ul - 非排序列表

2.内联元素:

  * a - 锚点 
  * abbr - 缩写 
  * acronym - 首字 
  * b - 粗体(不推荐) 
  * bdo - bidi override 
  * big - 大字体 
  * br - 换行 
  * cite - 引用 
  * code - 计算机代码(在引用源码的时候需要) 
  * dfn - 定义字段 
  * em - 强调 
  * font - 字体设定(不推荐) 
  * i - 斜体 
  * img - 图片 
  * input - 输入框 
  * kbd - 定义键盘文本 
  * label - 表格标签 
  * q - 短引用 
  * s - 中划线(不推荐) 
  * samp - 定义范例计算机代码 
  * select - 项目选择 
  * small - 小字体文本 
  * span - 常用内联容器,定义文本内区块 
  * strike - 中划线 
  * strong - 粗体强调 
  * sub - 下标 
  * sup - 上标 
  * textarea - 多行文本输入框 
  * tt - 电传文本 
  * u - 下划线 
  * var - 定义变量

 3.可变元素:

可变元素为根据上下文语境决定该元素为块元素或者内联元素。 
  * applet - java applet 
  * button - 按钮 
  * del - 删除文本 
  * iframe - inline frame 
  * ins - 插入的文本 
  * map - 图片区块(map) 
  * object - object对象 
  * script - 客户端脚本

4.区别:

块级元素另起一行,内联元素不会另起一行。

div常用于文档布局(块级元素),span常用于文本容器(内联元素)

 div 唯一标识

<div id="hotList">
   <h2>排行榜</h2>
    <ol>
       <li>权威指南</li>
       <li>编程艺术</li>
       <li>语言精粹</li>
    </ol>
</div>

  

 

参考:http://blog.csdn.net/sjw890821sjw/article/details/7883978

posted @ 2016-07-12 19:25  cysummery  阅读(304)  评论(0编辑  收藏  举报