HTML5之全局属性

全局属性

在HTML5中，定义了少量对所有元素都有效的属性。

1.contenteditable，标签设置了contenteditable属性后，可以直接在页面上修改编辑。编辑之后，元素的宽高自动适应

注意：如果只是设置了contenteditable属性没有值，其默认值是true

<pcontenteditable="true">p段落1.可以编辑</p>
<pcontenteditable="false">p段落2不可以编辑</p>
<pcontenteditable>p段落3可以编辑</p>

如果给div设置了这个属性，那么里面的内容可以修改，即属性可以被继承，有就近原则。

<divcontenteditable>
    <p>试一试</p>
    <p>试一试</p>
</div>

2. designMode。用来指定整个页面是否可以编辑，当值为on时，相当于页面和是哪个都设置了contenteditable=true

document.designMode="on";

相反的值就是off

该属性在IE8以下的浏览器无效。

3.hidden，可以实现对元素的隐藏，不占位置 等价于display:none,visibility:hidden隐藏内容但是占位置

注意：hidden的值就是hidden，所有只写一个hidden属性名就可以了

<p>-----这是分界线1-----</p>
<divclass="div1">
    <p>试一试</p>
    <p>试一试</p>
</div>
<p>-----这是分界线2-----</p>
<divclass="div2">
    <p>试二试</p>
    <p>试二试</p>
</div>
<p>-----这是分界线3-----</p>
<divclass="div3"hidden>
    <p>试三试</p>
    <p>试三试</p>
</div>
<p>-----这是分界线4-----</p>

 

4.spellcheck，是html5专门为input和textarea标签提供新属性，他的功能就是对用户输入的内容进行拼写和语法检查，如果拼写错误，文字下出现一个波浪线，spellcheck = “false”，关闭错误检查

<inputtype="text"spellcheck="true"/>

<textareaspellcheck="true"></textarea>

 

5.tabindex,默认值是0，设置负数不被选中。按下键盘的tab键会按设定的顺序聚焦，选中的标签可以是input输入框，input按钮，a标签等。

<div>
    <label>姓名</label>
    <inputtype="text"tabindex="1"/>
</div>
<div>
    <label>性别</label>
    <inputtype="text"/>
</div>
<div>
    <label>年龄</label>
    <inputtype="text"tabindex="-2"/>
</div>
<div>
    <label>身份证号</label>
    <inputtype="text"tabindex="3"/>
</div>
<div>
    <inputtype="button"value="提交"tabindex="4"/>
</div>
<div>
    <ahref="www.baidu.com">百度</a>
</div>