HTML5之全局属性

xiaoxiao2021-02-28  149

全局属性

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>

转载请注明原文地址: https://www.6miu.com/read-19733.html

最新回复(0)