第六十八节,htnl全局属性和其他属性
htnl全局属性和其他属性
学习要点:
1.实体
2.元数据
3.全局属性
本章主要探讨HTML5中的HTML实体、以及HTML核心构成的元数据,最后了解一下HTML中的全局属性。
一.实体
HTML实体就是将有特殊意义的字符通过实体代码显示出来。使用方法,实体名称或者实体编号
显示结果 实体名称 实体编号 描述
空格
< < < 小于号
> > > 大于号
& & & 和号
" " " 引号
' ' ' 撇号
¢ ¢ ¢ 分
£ £ £ 镑
¥ ¥ ¥ 日圆
€ € € 欧元
§ § § 小节
© © © 版权
® ® ® 注册商标
™ ™ ™ 商标
× × × 乘号
÷ ÷ ÷ 除号
二.元数据
<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全局属性和其他属性的更多相关文章
- 第三百六十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)用Django实现搜索的自动补全功能
第三百六十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—用Django实现搜索的自动补全功能 elasticsearch(搜索引擎)提供了自动补全接口 官方说明:https://www.e ...
- 第一百六十八节,jQuery,表单选择器
jQuery,表单选择器 学习要点: 1.常规选择器 2.表单选择器 3.表单过滤器 表单作为 HTML 中一种特殊的元素,操作方法较为多样性和特殊性,开发者不但可以 使用之前的常规选择器或过滤器,也 ...
- 第二百六十八节,Tornado框架-路由映射之二级域名支持,html模板继承以及导入
Tornado框架-路由映射之二级域名支持,html模板继承以及导入 二级域名路由映射add_handlers()设置二级域名路由映射 注意:二级域名需要结合服务器ip绑定域名 框架引擎 #!/usr ...
- 第三百四十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—通过自定义中间件全局随机更换代理IP
第三百四十八节,Python分布式爬虫打造搜索引擎Scrapy精讲—通过自定义中间件全局随机更换代理IP 设置代理ip只需要,自定义一个中间件,重写process_request方法, request ...
- 使用Typescript重构axios(二十六)——添加HTTP授权auth属性
0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...
- 第六十四天 JS基础操作
一.分支结构 1.if语句 if基础语句 if(条件表达式){ 代码块: } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通表达式 // 0.undefined ...
- SpringBoot进阶教程(六十四)注解大全
在Spring1.x时代,还没出现注解,需要大量xml配置文件并在内部编写大量bean标签.Java5推出新特性annotation,为spring的更新奠定了基础.从Spring 2.X开始spri ...
- html5全局属性
全局属性:对于任何一个标签都是可以使用的属性. 一.data-* 在html5之前需要在html标签上添加自定义属性来存储和操作数据,可能是会写<form role="xxx" ...
- 小强的HTML5移动开发之路(13)——HTML5中的全局属性
来自:http://blog.csdn.net/dawanganban/article/details/18179483 一.accssskey 快捷键 <!DOCTYPE HTML> ...
随机推荐
- Mybatis学习笔记(三) 之Dao开发
使用Mybatis开发Dao,通常有两个方法,即原始Dao开发方法和Mapper接口开发方法,常用还是Mapper接口开发. SqlSession的使用范围 public class test1 { ...
- C#Redis字符串
上周六通宵打牌周日白天只睡3小时累成狗,从今天起以后不能玩太大的了,小赌怡情大赌伤身,和同事朋友有空玩玩还是好的.今天公司外面马路上有人挂灯笼时死了一个人,哎,快过年了悲剧又发生了,真是生命是脆弱的. ...
- 解决了IE8不支持数组的indexOf方法
ie在过去给我们添了很多坑. if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(elt /*, from*/ ) { ...
- C#把gird数据导出到excel
/// <summary> /// DataTable导出到Excel /// </summary> /// <param na ...
- [SQL基础教程] 4-3 数据的更新(UPDATE)
[SQL基础教程] C4 数据更新 4-3 数据的更新(UPDATE) UPDATE UPDATE <表名> SET <列名> = <表达式>; UPDATE &l ...
- My Eclipse Security Alert
SECURITY ALERT: INTEGRITY CHECK ERROR This product did not pass the MyEclipse integrity check. This ...
- 转载:jsp九大内置对象和四大作用域
摘要: JSP的九大内置对象: page,application,session,request,response,out,exception,config,pageContext. JSP的四个作用 ...
- [MFC美化] SkinSharp使用详解2-SkinH.h函数介绍
SkinSharp功能强大,该皮肤库支持完全多种颜色改变等. 下面是静态链接库时的SkinH.h头文件: /*在Stdafx.h文件中加入如下语句 #include "SkinH.h&quo ...
- android studio 将library导出为jar 亲测成功
本人使用的是helloChart这个开源项目,其主要用于图表,来自git 地址为:https://github.com/lecho/hellocharts-android 下载命令为 git clon ...
- jsp中使用java函数
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%> ${fn ...