4.HTML 常用标签及属性

HTML 标签表

1. 链接

标签:
    <a></a>
属性:
    href:链接地址
    target:打开方式
        _blank:新标签页打开
        _self:当前页面打开(默认)
    title:链接提示

2. 文本标记

标题元素

<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

文本样式

斜体:
    <i></i>
粗体:
    <b></b>
删除线:
    <s></s>
下划线:
    <u></u>
上标:
    <sup></sup>
下标:
    <sub></sub>

段落元素

<p></p>

换行元素

<br/>

分割线元素

标签:
    <hr/>
属性:
    size:尺寸
    width:宽度
    color:颜色
    align:水平对齐方式
        left/center/right

分区元素

块分区元素:
    <div></div>
行内分区元素:
    <span></span>

块级元素与行内元素

块级元素:
    <p></p>
    <div></div>
    <h1~6></h1~6>
行内元素:
    <img/>
    <a></a>
    <i></i>
    <b></b>
    <s></s>
    <u></u>
    <sub></sub>
    <sup></sup>
    <span></span>

3. 图像

标签:
    <img/>
属性:
    src:图片地址
    width:图像宽度
    height:图像高度

4. 表格

标签:
    <table></table>
属性:
    width:宽度
    height:高度
    border:边框宽度
    bgcolor:背景颜色
    cellpadding:内边距
    cellspacing:外边距
    align:水平对齐方式
        left/center/right

子元素

标签:
    <tr></tr>(创建表行)
属性:
    bgcolor:背景颜色
    align:水平对齐方式
        left/center/right
    valign:垂直对齐方式
        top/middle/bottom

标签:
    <td></td>(创建单元格)
属性:
    width:宽度
    height:高度
    align:水平对齐方式
    valign:垂直对齐方式

<caption></caption>(表格标题)
<th></th>(列标题)
<thead></thead>(表头)
<tbody></tbody>(表主体)
<tfoot></tfoot> (表尾)

5. 列表

有序列表

<ol>
    <li></li>
</ol>
属性:
    type:标识类型,默认为数字排列
        1(默认)/a/A/i/I
    start:定义起始值,默认从1开始

无序列表

<ul>
    <li></li>
</ul>
属性:
    type:标识类型
        disc(默认)/circle/square/none

自定义列表

<dl>
    <dt>列表中的标题</dt>
    <dd>列表中的数据</dd>
</dl>

6. 表单

标签:
    <form></form>
属性:
    name:表单名称
    action:提交地址
    method:提交方式
        get/post

input 元素

标签:
    <input/>
属性:
    name:控件名称
    type:控件类型
    value:值
    disabled:禁用

常用表单控件

文本框:
    <input type="text"/>
密码框:
    <input type="password"/>
    属性:
        readonly:控件只读
        maxlength:限制字符数
单选按钮:
    <input type="radio"/>
复选框:
    <input type="checkbox"/>
    属性:
        checked:设置默认被选中
提交按钮:
    <input type="submit"/>
重置按钮:
    <input type="reset"/>
普通按钮:
    <input type="button"/>
图片按钮:
    <input type="image" src=""/> 
文件选择框:
    <input type="file"/>
隐藏域:
    <input type="hidden"/>

button 元素

<button>内容</button>

select 和 option 元素

<section name="">
    <option value="" selected></option>
</section>

7. 结构标记

<header></header>
<nav></nav>
<aside></aside>
<article></article>
<section></section>
<footer></footer>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 4,110评论 0 0
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,352评论 1 41
  • 1.有序列表、无序列表、自定义列表如何使用?写个简单的例子。三者在语义上有什么区别?在哪些情况下使用哪种(重要)?...
    王康_Wang阅读 634评论 0 0
  • 网上看到很多都是改fstab挂载的,太复杂了。Paragon NTFS For Mac 又是要钱的。最近发现一个 ...
    奋斗中的菜同学阅读 1,539评论 0 0
  • 春雪组诗 一场雪 为了留下来 你等待一场雪 等了整整一个冬天 直到 春天 雪才落下来 2017年的第一场雪 我要抓...
    云过留痕阅读 217评论 0 1