1.contentEditable属性

1、功能说明

（1）功能：允许用户编辑元素中的内容

（2）说明：是一个布尔值，false是不能编辑，true为可编辑

该元素还隐藏一个inherit状态  也是一个布尔值 。如果不指定，则由该元素继承的父级元素来决定

2、分析实例

（1）contenteditable属性为false

  1.  <!DOCTYPE html>
  2.  <head>
  3.     <meta charset="utf-8" />
  4.     <title>contentEditable</title>
  5.  </head>
  6.  <body>
  7.     <ul contenteditable="false">
  8.           <li>星期一</li>
  9.           <li>星期二</li>
  10.           <li>星期三</li>
  11.           <li>星期四</li>
  12.           <li>星期五</li>
  13.           <li>星期六</li>
  14.           <li>星期日</li>
  15.      </ul>\
  16.  </body>

显示结果

（2）contenteditable属性为true

  1. <!DOCTYPE html>
  2. <head>
  3.    <meta charset="utf-8" />
  4.    <title>contentEditable</title>
  5. </head>  
  6.  
  7. <ul contenteditable="true">
  8.   <li>星期一</li>
  9.   <li>星期二</li>
  10.   <li>星期三</li>
  11.   <li>星期四</li>
  12.   <li>星期五</li>
  13.   <li>星期六</li>
  14.   <li>星期日</li>
  15. </ul>

显示结果

2.designMode属性

该属性用来指定整个页面是否可编辑，当页面可编辑时，页面中任何支持 contentEditable 的元素都变成可编辑状态。

该属性只能在JavaScript脚本中编辑修改。该属性有两个值——“on” 与 “off” 。属性为 “on”时，页面可编辑；为 “off”时，页面不可编辑。
             页面中有

  1.  <iframe id="editor">可以标记</iframe>

在JavaScript脚本中指定designMode属性的方法如下：

  1.  editor.document.designMode="on";

3.Hidden属性

所有元素都允许使用该属性。
           该元素类似于 input 元素中的 hidden 元素，功能是通知浏览器不渲染该元素，是该元素处于不可近状态。

4.spellcheck属性

spellcheck 属性规定是否对元素内容进行拼写检查。

可对以下文本进行拼写检查：

  • 类型为 text 的 input 元素中的值（非密码）
  • textarea 元素中的值
  • 可编辑元素中的值

5.tabindex属性

当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动，这是一个相当方便实用的功能。但如果网页中链接太多，恐怕按TAB键就没什么作用了，这时不妨通过改变        TAB键移动的顺序来突出重点，在某些重要页面上方便访问者。

使用TABINDEX属性可以设置TAB键在链接中的移动顺序。把链接的TABINDEX属性设成1到32767的一个值，就可以把这个链接加入到 TAB键的序列中，而若把                    TABINDEX属性设为一个负值（如TABINDEX="-1"），那么这个链接将被排除在TAB键的序列之外。

当浏览者使用TAB键在网页链接中移动时，将首先移动到具有最小TABINDEX属性值的链接上，最后在具有最大TABINDEX属性值的链接上结束移动。如果有两个链接的            TABINDEX属性相同，则以链接在html代码中出现的顺序为准。

  1.  <a href="http://www.microsoft.com/" tabindex="-1">Microsoft</a>
  2.  <a href="http://www.microsoft.com/" tabindex="0">Microsoft</a>
  3.  <a href="http://www.microsoft.com/" tabindex="1">Microsoft</a>
  4.  <a href="http://www.microsoft.com/" tabindex="2">Microsoft</a>
  5.  <a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>

html5中常见的全局属性的更多相关文章

  1. HTML5中script的async属性异步加载JS

    HTML5中script的async属性异步加载JS     HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...

  2. html5中script的async属性

    html5中script的async属性 我兴奋于html5的原因之一是一些久久未能实现的特性现在可以真正运用于实际项目中了. 如我们使用placeholder效果蛮久了但是那需要javascript ...

  3. css3系列-2.css中常见的样式属性和值

    css3系列-2.css中常见的样式属性和值 继续上一篇文章的继续了解css的基础知识,关注我微信公众号:全栈学习笔记 css中常见的样式属性和值 字体与颜色 背景属性 文本属性 边框属性 内外边距 ...

  4. iOS开发设置关于tabBar和navigationBar以及item中的一些全局属性

    /* To set item label text attributes use the appearance selectors available on the superclass, UIBar ...

  5. html5中新的标准属性

    属性                                        值                                  描述accesskey             ...

  6. HTML5中 基本用法及属性 韩俊强的博客

    从今天开始更新H5相关学习:希望大家能一起学习,多学习一门语言,多一门乐趣! 了解Html5: Html5基本属性: <!DOCTYPE html> <html lang=" ...

  7. html5中 input的pattern属性 和 details/summary元素

    html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...

  8. HTML5中form的新增属性或元素

    1.新增的表单元素 1.1 progress表示任务的完成情况,常用于进度条. max 定义进度元素所要求的任务的工作量,默认值为1 value 定义已经完成的工作量,如果max值为1,该值必须是介于 ...

  9. HTML5中标记与特殊属性

    不允许写结束标记的元素有(只允许<元素/>): area.base.br.col.command.embed.hr.img.input. keygen.link.meta.param.so ...

随机推荐

  1. gdb进程调试，多进程调试

    1.单进程的调试 常规的通过gdb cmd这种方式开启调试,特别说明的是通过attach的方法附加到一个指定的进程上去进行调试,这种方法适合于调试一个已经运行的进程,具体用法:  gdb -p [pi ...

  2. codePrinter

    3天前,荆老师给了我一台打印机,让我完成省赛代码打印系统的测试. 打印机型号为 HP P1007,算是一台比较老的打印了. 本文记录了从打印机驱动安装到代码打印WEB部署的全过程 1. 安装打印机驱动 ...

  3. 双11遇上ZBrushCore，如此优惠还等什么！

    对不起!让大家久等了,ZBrush简体中文版ZBrushCore这次是真的来了,恰逢双11,老板说了,钱不是问题,你们开心就好,特别是热爱3D的单身狗们!你们那么热爱这个行业,1099元/套终身授权使 ...

  4. java程序设计线程池(newCachedThreadPool())

    创建一个无界的可缓存的线程池,若线程长时间没用会自动销毁,直接上代码好了: import java.util.concurrent.ExecutorService; import java.util. ...

  5. Oracle数据库

    一.数据库表空间和数据文件 解析:一个数据库下可以开N个表空间,一个表空间可以包含N个数据文件.表空间是逻辑概念. 二.关于listener.ora位置 修改该界面上的数据,会影响指定路径的监听配置文 ...

  6. Java正则抓取email

    实现思路 1.使用Java.net.URL对象,绑定网络上某一个网页的地址 2.通过java.net.URL对象的openConnection()方法获得一个HttpConnection对象 3.通过 ...

  7. ThinkPHP常用查询

    1.常规 $map2['state'] = 1; $User->where ( $map2 )->find(); 2. OR 查询 $where['name'] = array('neq' ...

  8. tfs2012迁移，只用到源代码管理

    背景:在虚拟机里面安装的tfs,后来发觉C盘空间太少了,运行卡,准备重新配置一台虚拟机当做tfs服务器.安装相同版本的tfs.数据库(至少比原来的版本一样或者更高版本,要不附加不了数据库). 1.确保 ...

  9. p2p网贷平台设计简析

    以我之前主持开发的一个商业产品:p2p网贷为例进行分析.整个的概况,可以参见:www.huixinp2p.com(目的只会技术交流) 界面可以直接参考前期博客:http://www.cnblogs.c ...

  10. iOS聊天下拉刷新聊天记录的实现

    1. 想法 最近在开发一个社交类app,要实现类似微信那种下拉刷新聊天记录的功能. 一般有两种实现方式: 1. 直接fetch一个entity的所有数据然后在内存中做filter,就是把所有聊天记录先 ...