html5 属性变化

input 标签,新增的type 类型:

email / url / number / range / Date picker / search / color / tel

表单属性

autocomplete / autofocus / multiple / placeholder / required

链接属性

<link> 的size 属性 / <base> 的target 属性 / 超链接<a>

其他属性

script / ol / html / style 


input标签:

- 在PC 端并没有大的区别,但手机端有区别:

	<input type="email" name="email">
	<input type="url" name="url">
	<input type="tel" name="teliphone">
	<input type="number" name="number">

- date pickers input类型

    Date: 选取日、月、年

    Month:选取月、年

    Week:选取周、年

    Time:选取时间(小时和分钟)

    Datetime:选取时间、日、月、年(UTC时间)

    Datetime-local:选取时间、日月年(本地时间)

	date:<input type="date" name="date"><br>
	month:<input type="month" name="month"><br>
	week:<input type="week" name="week"><br>
	time:<input type="time" name="time"><br>
	datetime:<input type="datetime" name="datetime"><br>
	datetime-local:<input type="datetime-local" name="datetime-local">

- input 其他类型

	<input type="range" name="range" min="1" max="10"><br>
	<input type="search" name="search"><br>
	<input type="color" name="color"><br>


表单属性:

1. autocomplete 属性

   form 或 input 域应该拥有自动完成功能

    <form autocomplete="on"></form>

   autocomplete 适用于<form> 标签,以及以下类型的input标签:text, search, url, telephone, email, password, datepickers, range, color.

   一旦开启该属性,曾经提交过的表单中包含的内容会被保存,下次刷新时,输入时,会有下拉框提示。一个form 开启该功能,其子元素默认都开启,若想其中某个子元素不具备该功能,给该元素关闭上属性即可。

	<form autocomplete="on">
		<input type="search" name="search">
		<input type="email" name="email" autocomplete="off">
		<input type="submit" name="submit">
	</form>

2. autofocus 属性

    规定在页面加载时,域自动地获得焦点

     <input type="" autofocus="autofocus">

    该属性适用于所有的input 标签类型。


3. multiple 属性

    规定输入域中可选择多个值

    multiple 属性适用于以下类型的input 标签:email 和 file.

    <input type="file" multiple="multiple">

<input type="file" name="file" multiple="multiple">


4. placeholder 属性

    提供一种提示(hint),描述输入域所期待的值。

    <input type="search" placeholder="请输入要搜索的值"> 

    placeholder 属性适用于input 标签type 属性值为:text,search,url, telephone, email, password.


5. required 属性

    当提交时,为空,或者明显格式不对,能阻止提交并提示。

    <input type="email" name="email" required="required">

   required 属性适用于input 标签type 属性值为:text,search,url, telephone, email, password, time pickers, number, checkbox, radio, file.


链接属性

1. size 属性

   控制网页在标签栏中显示图片的size,清晰度可控

    <link rel="icon" href="icon.href" type="image/gif" size="16*16">


2. target 属性

    用于<base>标签中,<base>标签写在<head></head>内,页面的链接按钮,都是在新加页打开。

    <base href="http://localhost/" target="_blank">

3. a 标签对应的属性

    (1)media=“handheld/tv”, handheld 表示链接到的是手持设备,tv 表示链接到的是电视设备

    (2)hreflang="zh" 设置语言,这里设置语言是中文

    (3)rel="external" 设置超链接的引用,这里超链接为外部链接


script 属性

1. defer 属性【仅在IE浏览器生效】

   加载完脚本后并不执行,而是等整个页面加载完后再执行

  <script defer="defer" src="url"></script>

2. async 属性【兼容目前所有主流浏览器】

    加载完脚本后立即执行,不用等整个页面都加载完,属于异步执行(多线程,既加载脚本又往后读取html)

    <script async="async" src="url"></script>


ol 有序列表属性

start - 起始值

reverse - 倒叙排列

  <ol start="10" reversed>

    <li>Html</li>

    <li>Css</li>

  </ol>


其他属性

html 的manifest 属性

manifest="cache.manifest" (定义页面离线应用文件)

<html manifest="cache.manifest">


style标签的 scoped,使得style 标签可以在html 的任意位置写css 代码

<style scoped>

...

</style>

猜你喜欢

转载自blog.csdn.net/purple_lumpy/article/details/79982047