基础：

<!DOCTYPE>

定义文档的类型

语法：

html5

<!DOCTYPE html>

<html>

定义html文档，这个就不多说了！

<title>

定义文档的标题

提示：<title> 标签是 <head> 标签中唯一要求包含的东西。

<body>

定义文档的主体

<h1>...

定义html的标题

<p>

定义段落

<br>

定义简单的换行

<hr>

定义水平线

<!--...-->

定义注释

 格式：

<abbr>

定义缩写

实例：

The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.

<address>

定义文档作者的联系信息

提示：<address> 元素通常连同其他信息被包含在 <footer> 元素中。

<pre>

定义预格式的文本，在其中的文本会保留格式。

说明：一般来说，格式类元素都可以通过css来实现，也推荐使用css方式实现。

表单：

<form>

定义表单

常用属性：

action 提交表单时，会将数据发送到何处

autocomplete 默认on，就是一个记忆功能。

method="post|get"

target="_blank|_self"
enctype 定义表单中的数据在发送到服务器之前，如何进行编码，值为：

application/x-www-form-urlencoded    在发送前编码所有字符（默认）

multipart/form-data

不对字符编码。

在使用包含文件上传控件的表单时，必须使用该值。

text/plain    空格转换为 "+" 加号，但不对特殊字符编码。
<input>
用于收集用户输入的信息

常用属性

accept="image/gif,image/jpg" 规定能够通过文件上传进行提交的文件类型。

注意：只有当tyep="file"时才有效。

checked 属性规定在页面加载时应该被预先选定的 input 元素。

注意：checked 属性 与 <input type="checkbox"> 或 <input type="radio"> 配合使用。

disabled 禁用input元素

formaction=url 覆盖 form 元素的 action 属性。

注意：该属性适用于 type="submit" 以及 type="image"。

max 规定输入字段所允许的最大值。

注释：max 和 min 属性适用于以下 <input> 类型：number, range, date, datetime, datetime-local, month, time 以及 week。

maxlength 规定输入字段的最大长度，以字符个数计

注：maxlength 属性与 <input type="text"> 或 <input type="password"> 配合使用。

multiple 规定可选多个文件

语法：

<input multiple="multiple">

注释：multiple 属性使用欧冠与以下 <input> 类型：email 和 file。

pattern 规定用于验证输入字段的模式。

语法：

<input pattern="regexp">

注释：pattern 属性适用于以下 <input> 类型：text, search, url, telephone, email 以及 password 。

placeholder 提示信息

注释：placeholder 属性适用于以下的 <input> 类型：text, search, url, telephone, email 以及 password。

readonly 	把输入字段设置为只读。

注意：readonly 属性可与 <input type="text"> 或 <input type="password"> 配合使用。

required 规定必需在提交之前填写输入字段。

语法：

<input required="required">

注释：required 属性适用于以下 <input> 类型：text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。

value input 元素设定值。

对于不同的输入类型，value 属性的用法也不同：

    type="button", "reset", "submit" - 定义按钮上的显示的文本

    type="text", "password", "hidden" - 定义输入字段的初始值

    type="checkbox", "radio", "image" - 定义与输入相关联的值

注释：<input type="checkbox"> 和 <input type="radio"> 中必须设置 value 属性。

注释：value 属性无法与 <input type="file"> 一同使用。

type 定义input元素的类型

button 	定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。

checkbox 	定义复选框。

file 	定义输入字段和 "浏览"按钮，供文件上传。

hidden 	定义隐藏的输入字段。

image 	定义图像形式的提交按钮。

password 	定义密码字段。该字段中的字符被掩码。

radio 	定义单选按钮。

reset 	定义重置按钮。重置按钮会清除表单中的所有数据。

submit 	定义提交按钮。提交按钮会把表单数据发送到服务器。

text 	定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。

<textarea>

cols 属性规定 textarea 的可见宽度。

rows 属性规定 textarea 的可见高度。

<button>

注释：如果在 HTML 表单中使用 button 元素，不同的浏览器会提交不同的按钮值。请使用 input 元素在 HTML 表单中创建按钮。

<select>

select 元素可创建单选或多选菜单。

<select&> 元素中的 <option> 标签用于定义列表中的可用选项。

<optgroup>

<optgroup> 标签定义选项组。

optgroup 元素用于组合选项。当您使用一个长的选项列表时，对相关的选项进行组合会使处理更加容易。

常用属性：label 	text 	为选项组规定描述。

<option>

在 HTML 中，<option> 没有结束标签。

<label>

<label> 标签为 input 元素定义标注（标记）。

常用属性：

for 	id 	规定 label 绑定到哪个表单元素。

form 	formid 	规定 label 字段所属的一个或多个表单。

<datalist>

datalist 及其选项不会被显示出来，它仅仅是合法的输入值列表。

请使用 input 元素的 list 属性来绑定 datalist。

实例：

<input id="myCar" list="cars" />

<datalist id="cars">

  <option value="BMW">

  <option value="Ford">

  <option value="Volvo">

</datalist>

图像：

<img>

<img> 标签有两个必需的属性：src 属性 和 alt 属性。

常用属性：

必须

alt 	text 	规定图像的替代文本。

src 	URL 	规定显示图像的 URL。

可选

height px|% 定义图像的高度。

width px|% 定义图像的宽度

音视频：

<video>

定义视频

autoplay 	autoplay 	如果出现该属性，则视频在就绪后马上播放。

controls 	controls 	如果出现该属性，则向用户显示控件，比如播放按钮。

height 	pixels 	设置视频播放器的高度。

loop 	loop 	如果出现该属性，则当媒介文件完成播放后再次开始播放。

muted 	muted 	规定视频的音频输出应该被静音。

poster 	URL 	规定视频下载时显示的图像，或者在用户点击播放按钮前显示的图像。

preload 	preload 	

如果出现该属性，则视频在页面加载时进行加载，并预备播放。

如果使用 "autoplay"，则忽略该属性。

src 	url 	要播放的视频的 URL。

width 	pixels 	设置视频播放器的宽度。

<audio>

定义音频

autoplay 	autoplay 	如果出现该属性，则音频在就绪后马上播放。

controls 	controls 	如果出现该属性，则向用户显示控件，比如播放按钮。

loop 	loop 	如果出现该属性，则每当音频结束时重新开始播放。

muted 	muted 	规定视频输出应该被静音。

preload 	preload 	

如果出现该属性，则音频在页面加载时进行加载，并预备播放。

如果使用 "autoplay"，则忽略该属性。

src 	url 	要播放的音频的 URL。

链接：

<a>

常用属性：

href 	URL 	规定链接指向的页面的 URL。

rel 	text 	规定当前文档与被链接文档之间的关系。

target 	规定在何处打开链接文档。

    _blank

    _parent

    _self

    _top

    framename

<link>

<link> 标签定义文档与外部资源的关系。

常用属性：

href 	URL 	规定被链接文档的位置。

rel 	

    alternate

    author

    help

    icon

    licence

    next

    pingback

    prefetch

    prev

    search

    sidebar

    stylesheet

    tag

	规定当前文档与被链接文档之间的关

列表：

<ul>

无序列表

<ol>

有序列表

<li>

<li> 标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中。

表格：

<table>

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

常见属性

border 	pixels 	规定表格边框的宽度。

cellpadding px|%  规定单元边沿与其内容之间的空白。

cellspacing pixels|%  规定单元格之间的空白。

frame

    void

    above

    below

    hsides

    lhs

    rhs

    vsides

    box

    border

	规定外侧边框的哪个部分是可见的。

rules

    none

    groups

    rows

    cols

    all

	规定内侧边框的哪个部分是可见的。

summary 	text 	规定表格的摘要。

width %|px 规定表格的宽度。

<caption>

caption 元素定义表格标题，紧跟着table元素

<th> 	定义表格中的表头单元格。

<tr> 	定义表格中的行。

<td> 	定义表格中的单元。

<thead> 	定义表格中的表头内容。

<tbody> 	定义表格中的主体内容。

<tfoot> 	定义表格中的表注内容（脚注）。

样式\节：

<style>

定义样式

<div>

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

<span>

用来组合文档中的行内元素。

元信息：

<head>

定义头部

<meta>

定义元信息

常见属性：

content 	some_text 	定义与 http-equiv 或 name 属性相关的元信息

http-equiv 	

    content-type

    expires

    refresh

    set-cookie

	把 content 属性关联到 HTTP 头部。

name 	

    author

    description

    keywords

    generator

    revised

    others

	把 content 属性关联到一个名称。

scheme 	some_text 	定义用于翻译 content 属性值的格式。

编程：

<script>

常见属性：

src 	URL 	规定外部脚本文件的 URL。

async 	async 	规定异步执行脚本（仅适用于外部脚本）。

<embed>

定义嵌入的内容，比如插件。

属性：

height 	pixels 	设置嵌入内容的高度。

src 	url 	嵌入内容的 URL。

type 	type 	定义嵌入内容的类型。

width 	pixels 	设置嵌入内容的宽度。

html之常用元素的更多相关文章

  1. web.xml常用元素配置

    tomcat服务器: tomcat是一个WEB服务器,所有的j2ee WEB程序可以在此处运行. tomcat服务器是一个符合j2ee标准的WEB服务器.则J2ee的EJB程序无法在此处运行. 如果要 ...

  2. 常用元素的属性/方法 attr / val / html /text

    常用元素的属性/方法 得到一个元素的高度, $("#myid").height() 得到一个元素的位置, $("#myid").offset() 返回的是一个o ...

  3. Robotframework + Appium 之常用元素定位方法

    任何自动化测试,其实手动测试也是一样的,元素定位(目标定位)是首要任务,这是最直接的测试对象呀! 好了,废话不多说,又到了元素定位啦,之前我们已经介绍过selenium及appium常用的定位方法,下 ...

  4. selenium - 常用元素操作

    # 3.常用元素操作 # 元素对象的获取ele = driver.find_element_by_XXX('定位表达式') # 获取元素的文本内容(返回值为元素的文本)ele.text # 获取元素的 ...

  5. 基于appium的常用元素定位方法

    一.元素定位工具 app应用的元素使用的是控件定位,不同于web网页,web网页定位元素通常使用的是F12工具,那么在app当中我们则要借助其它的工具来辅助定位. 1.uiautomatorviewe ...

  6. 第二篇 HTML 常用元素及属性值

    常用元素及属性值 先和同学了解下,一部分常用的元素,区别以及属性,常用在哪里.   标签是由左右尖括号抱起来的,由开始标签开始,再由结束标签结束,里面内容则是元素,比如:<div>< ...

  7. 前端笔记：Html页面常用元素

    Html页面由基本几个元素(标签)组成 html.head.body.foot(很少使用). html是整个页面的父级元素,内部包括head.body.foot子类标签. head是页头,及页面的头部 ...

  8. web.xml常用元素

    web.xml文件是用来初始化配置信息:比如welcome页面.servlet.servlet-mapping.filter.listener.启动加载级别等.当你的web工程没用到这些时,你可以不用 ...

  9. pom.xml常用元素解析

    project 最外层元素 modelVersion 指定Maven模型的版本号,对于Maven2和Maven3,它只能是4.0.0 version 版本信息 groupId 包id,会生成相应路径 ...

随机推荐

  1. [xsy2978]Product of Roots

    $\newcommand{align}[1]{\begin{align*}#1\end{align*}}$题意:给出$f(x)=\prod\limits_{i=1}^n(a_ix+1)$和$g(x)= ...

  2. 10.2（java学习笔记）JDBC事务简述

    一.事务 事务是指作为一系列操作组成的一个整体,该整体只有两种状态,要么全部执行,要么全部不执行. 当组成这个事务的所有语句都执行成功则该事务执行,只要有一条语句执行失败则该事务不执行. 假设这里有一 ...

  3. jdk8新特性

    JDK8新特性(JDK8的新特性) * 接口中可以定义有方法体的方法,如果是非静态,必须用default修饰 * 如果是静态的就不用了 class Test { public void run() { ...

  4. 网络编程-tcp

    一.简单的demo (1)客户端 package com.songyan.tcp; import java.io.IOException; import java.io.InputStream; im ...

  5. 在Code First中自动创建Entity模型

    之前我在博客文章中介绍过如何使用Code First来创建数据库,通过CodeFirst的方式,可以大幅的减少开发人员的工作量,比传统的先创建库再ORM的方式简单了不少.但是,很多时候,特别是一些MI ...

  6. 使用Ant项目打包

    一.前沿 前段时间公司为了做一个新闻发布系统,就使用了开源的JEECMS系统,(非人类啊,泪~~~),项目不是maven构建的,项目的打包部署非常的麻烦,没办法只能使用Ant,Ant是比较古老的打包部 ...

  7. weblogic下同域不同端口下的跨域问题解决

      环境:同一台服务器,同一个Weblogic应用程序,分别建两个域,两个域IP一样,端口不同.一个域里放Web应用A,一个放Web应用B. 操作:用户访问A程序的时候,A程序会返回一个链接,让用户去 ...

  8. Javascript高级程序设计 -- 第三章 -- 总结

    1.Javascript有几种数据类型 2.变量 Javascript有几种数据类型 JavaScript中有5种简单数据类型(也称为基本数据类型):Undefined.Null.Boolean.Nu ...

  9. nmcli日常用法

    一.nmcli日常用法nmcli dev status //查看系统现有网络设备的连接状态nmcli conn show //查看已有连接nmcli conn delete UUID1 UUID2 U ...

  10. Kafka 简单实验二（Python实现简单生产者消费者）

    Apache Kafka 是什么? Kafka 是一个开源的分布式流处理平台,其简化了不同数据系统的集成.流指的是一个数据管道,应用能够通过流不断地接收数据.Kafka 作为流处理系统主要有两个用处: ...