HTML 全局属性及其他

最新推荐文章于 2021-06-04 23:01:25 发布

xiaoxiaobukuang

最新推荐文章于 2021-06-04 23:01:25 发布

阅读量516

点赞数

分类专栏： HTML5 文章标签： html 全局属性

本文链接：https://blog.csdn.net/xiaoxiaobukuang/article/details/78225495

版权

HTML5 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

实体
元数据
全局属性

一、实体

HTML实体就是将有特殊意义的字符通过实体代码显示出来。

显示结果	描述	实体名称	实体编号
	空格
<	小于号	<	<
>	大于号	>	>
&	和号	&	&
"	引号	"	"
‘	撇号	' (IE不支持)	'
￠	分（cent）	¢	¢
£	镑（pound）	£	£
¥	元（yen）	¥	¥
€	欧元（euro）	€	€
§	小节	§	§
©	版权（copyright）	©	©
®	注册商标	®	®
™	商标	™	™
×	乘号	×	×
÷	除号	÷	÷

二、数据

1、指定名/值元数据对

<meta name="author" content="bnbbs">
<meta name="description" content="这是一个HTML5页面">
<meta name="keywords" content="html5，css3，响应式">
<meta name="generator" content="sublim text 3">

元数据名称	说明
author	当前页面的作者
description	当前页面的描述
keywords	当前页面的关键字
generator	当前页面的编码工具

2、声明字符编码

<meta charset="utf-8">

3、模拟HTTP标头字段

①、5秒跳转到其他页面

<meta http-equiv="refresh" content="5;全局属性和其他.html">

②、另一种声明字符编码

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

属性值	说明
refresh	重新载入当前页面，或指定一个URL。单位i秒
conten-type	另一种声明字符编码的方式

三、全局属性

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

1、id属性

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

然后在<head>中写到

<style type="text/css">
    #abc{
        color:red;
    }
</style>

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

2、class属性

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

然后在<head>中写到

<style type="text/css">
    .efg{
        color:red;
    }
</style>

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

3、accesskey属性

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

解释：快捷键操作，Windows下alt+指定键，前提是浏览器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>

解释：可以局部设置语言。

8、title属性

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

解释：对元素的内容进行额外的提示。

9、tabindex属性

<input type="text" name="user1" tabindex="2">
<br>
<input type="text" name="user2" tabindex="1">
<br>
<input type="text" name="user3" tabindex="-1">

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

10、style属性

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

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