htnl全局属性和其他属性

学习要点：
1.实体
2.元数据
3.全局属性

本章主要探讨HTML5中的HTML实体、以及HTML核心构成的元数据，最后了解一下HTML中的全局属性。

一．实体

HTML实体就是将有特殊意义的字符通过实体代码显示出来。使用方法，实体名称或者实体编号

       显示结果           实体名称             实体编号                  描述

                      　　            　                      空格

           <            　　&lt;            　　<               　　小于号

           >           　　 &gt;            　　>               　  大于号

           &          　　 &amp;            　&               　  和号

           "          　　 &quot;           　 "                     引号

           '           　　&apos;                '                    撇号

           ￠           　　&cent;               ¢                  分

           £         　　 &pound;              £                  镑

           ¥           　　&yen;                 ¥                   日圆

           €           　　&euro;               €                 欧元

           §          　　 &sect;                §                   小节

           ©           　　&copy;              ©                   版权

           ®          　　 &reg;                ®                   注册商标

           ™          　　&trade;              ™                  商标

           ×         　　 &times;               ×                    乘号

           ÷          　　&divide;              ÷                    除号

二．元数据
<meta>元素可以定义文档中的各种元数据，而且一个HTML页面可以包含多个<meta>元素。

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <!--定义文档的编码类型-->

    <meta charset="utf-8">

    <!--

        name, content 组合的示例如下（不全）

    -->

    <!--定义文档的作者-->

    <meta name="author" content="webabcd" />

    <!--定义文档的生成工具-->

    <meta name="generator" content="EditPlus" />

    <!--如果把此 html5 文档看成一个程序，则此处用于定义程序的名称-->

    <meta name="application-name" content="meta 标签的介绍" />

    <!--

        http-equiv, content 组合的示例如下（不全）

    -->

    <!--定义文档内容的语言-->

    <meta http-equiv="content-language" content="zh-CN" />

    <!--定义文档内容的类型-->

    <meta http-equiv="content-type" content="text/html" />

    <!--定义文档所使用的样式表的 title，从而在有多个样式表的时候，只使用指定 title 的样式表。本例中会强制只使用 title 为 css1 的样式表-->

    <meta http-equiv="default-style" content="css1" />

    <!--

    文档每多少秒刷新一次,或者跳转

    如果要做成跳转，content属性值里引号加跳转网址，不加网址就跳转本页，相当于刷新

    如：<meta http-equiv="refresh" content="1;www.baidu.com" />

    -->

    <meta http-equiv="refresh" content="1" />

    <!--设置 cookie-->

    <meta http-equiv="set-cookie" content="author=webabcd;" />

    <title>标题</title>
    <!--设置图标-->
　　 <link rel="icon" href="//www.jd.com/favicon.ico" mce_href="//www.jd.com/favicon.ico" type="image/x-icon">
    <!--定义关键字-->

    <meta name="keywords" content="html5, flash, silverlight" />

    <!--定义文档的描述信息-->

    <meta name="description" content="介绍 html5 中的 meta 标签" />
</head>

<body>

</body>

</html>

三．全局属性
在此之前，我们涉及到的元素都讲解了它的局部数据，当然也知道一些全局属性，比如id。全局属性是所有元素共有的行为，HTML5还提供了一些其他的全局属性。

1.id属性，id属性给元素分配一个唯一标识符 

<p id="abc">段落</p>

解释：id属性给元素分配一个唯一标识符。这种标识符通常用来给CSS和JavaScript 调用选择元素。一个页面只能出现一次同一个id名称。

2.class属性，用来给元素归类 

<p class="abc">段落</p>

<p class="abc">段落</p>

<p class="abc">段落</p>

解释：class属性用来给元素归类。通过是文档中某一个或多个元素同时设置CSS样式。

3.accesskey属性 ,输入框属性，快捷键操作

<input type="text" name="user" accesskey="n">

解释：快捷键操作，windows下alt+accesskey="n"指定键，光标定位到此输入框，前提是浏览器alt并不冲突。

4.contenteditable属性，让文本处于可编辑状态 

<p contenteditable="true">我可以修改吗</p>

解释：让文本处于可编辑状态，设置true则可以编辑，false则不可编辑。或者直接 设置属性。

5.dir属性，让文本左或者右

<p dir="rtl">文字到右边 </p>

解释：让文本从左到右（ltr），还是从右到左（rtl）。

6.hidden属性，隐藏元素 

<p hidden>文字 </p>

解释：隐藏元素。

7.lang属性，可以局部设置语言 

<p lang="en">HTML5</p>

解释：可以局部设置语言。zh-cn为中文，en为英文

8.title属性，对元素的内容进行额外的提示 

<p title="HTML5教程">HTML5</p>

解释：对元素的内容进行额外的提示。，也就是鼠标放上去会出现提示内容

9.tabindex属性，表单中按下tab键，实现获取焦点的顺序 

<input type="text" name="user" tabindex="2">

<input type="text" name="user" tabindex="1">

解释：表单中按下tab键，实现获取焦点的顺序。如果是-1，则不会被选中。

10.style属性 ，设置元素行内CSS样式

<p style="color:red;">CSS样式</p>

解释：设置元素行内CSS样式。

第六十八节，htnl全局属性和其他属性的更多相关文章

  1. 第三百六十八节，Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)用Django实现搜索的自动补全功能

    第三百六十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—用Django实现搜索的自动补全功能 elasticsearch(搜索引擎)提供了自动补全接口 官方说明:https://www.e ...

  2. 第一百六十八节，jQuery，表单选择器

    jQuery,表单选择器 学习要点: 1.常规选择器 2.表单选择器 3.表单过滤器 表单作为 HTML 中一种特殊的元素,操作方法较为多样性和特殊性,开发者不但可以 使用之前的常规选择器或过滤器,也 ...

  3. 第二百六十八节，Tornado框架-路由映射之二级域名支持，html模板继承以及导入

    Tornado框架-路由映射之二级域名支持,html模板继承以及导入 二级域名路由映射add_handlers()设置二级域名路由映射 注意:二级域名需要结合服务器ip绑定域名 框架引擎 #!/usr ...

  4. 第三百四十八节，Python分布式爬虫打造搜索引擎Scrapy精讲—通过自定义中间件全局随机更换代理IP

    第三百四十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—通过自定义中间件全局随机更换代理IP 设置代理ip只需要,自定义一个中间件,重写process_request方法, request ...

  5. 使用Typescript重构axios(二十六)——添加HTTP授权auth属性

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  6. 第六十四天 JS基础操作

    一.分支结构 1.if语句 if基础语句 if(条件表达式){ 代码块: } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通表达式 // 0.undefined ...

  7. SpringBoot进阶教程(六十四)注解大全

    在Spring1.x时代,还没出现注解,需要大量xml配置文件并在内部编写大量bean标签.Java5推出新特性annotation,为spring的更新奠定了基础.从Spring 2.X开始spri ...

  8. html5全局属性

    全局属性:对于任何一个标签都是可以使用的属性. 一.data-* 在html5之前需要在html标签上添加自定义属性来存储和操作数据,可能是会写<form role="xxx" ...

  9. 小强的HTML5移动开发之路（13）——HTML5中的全局属性

    来自:http://blog.csdn.net/dawanganban/article/details/18179483 一.accssskey  快捷键 <!DOCTYPE HTML> ...

随机推荐

  1. 使用vim配置方案spf13中碰到的一些问题

    目的:达到我自己自定义安装插件的目的 安装YCM(YouCompleteMe)自动补全神器之前的准备 先安装编译环境: 1 2 sudo apt-get install build-essential ...

  2. 想要见识外太空？一款VR头显就能帮你实现梦想

    除了宇航员,我们中的大多数人一生都没有机会前往地球之外的宇宙空间,只能在图片和纪录片中感受浩瀚宇宙的震撼. 美国肯尼迪航天中心和BrandVR合作推出的VR头显 而NASA在VR中的投资,创造的新的V ...

  3. orm2

    数据库连接 var orm = require("orm"); orm.connect("mysql://username:password@host/database& ...

  4. github从上传代码到发布静态网站

    1.上传代码 第一步:建立git仓库 cd到你的本地项目根目录下,执行git命令 git init 第二步:将项目的所有文件添加到仓库中 git add . 如果想添加某个特定的文件,只需把.换成特定 ...

  5. Python3 md5加密

    import hashlibuser = 'jointwisdom'pwd = 'zhonghui123'm2 = hashlib.md5()m2.update(pwd.encode("ut ...

  6. Unity 发布到IOS,Android的各种坑

    Unity 发布到IOS的注意事项1.开发环境MAC环境:Xcode环境 7.2.1Unity环境:Unity5.32.基本说明首先,我说一下,这是我在对Unity发布到IOS的实际使用中,总结出来的 ...

  7. LoRaWAN_stack移植笔记(一)--RF硬件相关

    和硬件相关的问题 TCXO 的使用 根据SX1276数据手册, 如果使用TCXO,则需要配置RegTcxo寄存器为0x19,代码如下 ``` c void SX1276SetTcxoConfig(vo ...

  8. 敏捷开发（十）- Scrum每日例会

    本文主要是为了检测你对SCRUM 评估会议的了解和使用程度, 通过本文你可以检测一下     1.你们的SCRUM 没人例会的过程和步骤    2.SCRUM 每日例会的输出结果一.会议目的      ...

  9. Chrome开发者控制台的这些功能你都知道吗？

    Chrome内置了一些开发者工具,这些工具提供了很多的功能.今天,我们将会专注于JavaScript控制台. 在我编程的过程中,这个控制台为我提供了大量的帮助. 如果你正在电脑端阅读这篇文章,你可以在 ...

  10. Python之软件管理

    常用软件包管理工具 一般python软件包管理工具,主要有以下: 图 常用python包管理工具 可以看到distribute是setuptools的替代方案(因为Setuptools包不再维护了), ...