《HTML常用属性》

最新推荐文章于 2023-05-30 16:14:43 发布

Dawn-s

最新推荐文章于 2023-05-30 16:14:43 发布

阅读量244

点赞数

分类专栏：笔记文章标签： html

本文链接：https://blog.csdn.net/m0_46372848/article/details/104872649

版权

笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

这篇博客将介绍有关HTML的一些历史与我觉得HTML一些比较常用的表章节的标签、全局属性等，当然还将介绍如何创建一个自己的HTML文档。

首先，我先向大家介绍一些HTML的历史由来：HTML它是**超文本标记语言**（它的全称是：**HyperText Markup Language**，简称：HTML）是一种用于创建网页的标准标记语言，而HTML他的发明者则是英国计算机科学家**蒂姆·伯纳斯-李**所创建的。

在了解完HTML的历史由来后，接下来就让我们开始进行HTML的学习吧。

首先如何创建一个自己的HTML文档，创建一个HTML文档的方法有很多就比如：可以用编译器vsCode、HBuilder等编译器进行HTML的创建，也可以通过在桌面创建一个记事本在编译完HTML的格式后将文件的后缀名改为 .html 这样也可以创建一个HTML文档，接下来让我来介绍如何手写HTML和如何在编译器里面创建一个HTML。

如果你使用的是vsCode编译软件，你可以在编译器的右上角的文件里面，点击新建创建一个文档将他ctrl+s保存，保存时将文件的后缀名改为.html，如：“code.html” 这样新建一个HTML文档，然后输入 ! 点击回车就创建好了一个HTML文档。
那当然如果你不想用编译器或者没有编译器的话，你也可以选择用记事本来进行HTML文档的创建，创建一个HTML需要以下代码：

<!DOCTYPE html>			//这段代码代表文档的类型
<html lang="en">		//这是代表HTML的标签

<head>
	<meta charset="UTF-8">	//这个是文档的字符编码 UTF-8是代表万国码的意思
	<meta name="viewport" content="width=device-width, initial-scale=1.0">		//这一段可以不用写代表禁止缩放兼容手机
	<meta http-equiv="X-UA-Compatible" content="ie=edge">	//可以不写这类是告知IE用最新内核
	<title>Document</title>		//这里就是你网页的标题了
</head>
<body>

</body>
</html>

像这样在记事本里面写完这些后将记事本后缀名改为 .html 就可以在网址里面打开了。

上面我们教完了如何创建HTML，那接下来就让我们来看HTML里面常用的表章节的标签、全局属性等。

表章节的标签

HTML内常用的表章节的标签我觉得有以下几个

section:章节他是文档中的区段，他的使用方法则是在<section>标签中写入内容如

<section>
  <h1>第一章</h1>
  <p>我的博客内容</p>
</section>

artical：定义外部的内容。他的使用方法则是在<article>标签中写入内容，而且article元素是可以嵌套使用的如

<article>
　　<header>
           <h1>第二章</h1>
　　　<p>article的使用</p>
　　</header>
　　
　　<section>
　　	<h2>进行嵌套</h2>
　　</section>
</article>

h1~h6:标签他则代表6中不同样式的标签，使用方法是在<h1>标签里面写入内容如

<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>

p:段落他是标记了一个段落，使用方法是在<p>标签里面写入内容如

<p>文章内容</p>

header:头部他是定义文档的页眉，使用方法是在<header>标签里面写入内容如

<header>
<h1>第五章</h1>
<p>内容</p>
</header>

footer:脚部他是定义文档的页脚，使用方法是在<footer>标签里面写入内容如

<footer>
<h1>第六章</h1>
<p>内容</p>
</footer>

main:主要内容他是规定文档的主要内容，使用方法是在<main>标签里面写入内容如

<main>
  <h1>第七章</h1>
  <p>内容1</p>
  
  <article>
    <h1>第七点五章</h1>
    <p>内容2</p>
  </article>
</main>

div：划分他是把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联，使用方法是在<div>标签里面写入内容如

<div>
<h2>第八章</h2>
<p>内容</p>
</div>

以上就是我觉得常用的表章节的标签，接下来我为大家介绍全局属性。

全局属性

class:属性规定元素的类名，使用方法比如在给div取一个class为div1的类名就在div标签内写入<div class="div1"></div>。
contenteditable：用于设置或返回元素的内容是否可编辑，比如设置一个div让用户来编辑内容写法：<div contenteditable></div>。
hidden：隐藏的段落，使用方法比如我需要隐藏一个p标签<p hidden></p>。
id：用来表示全局唯一的标签，使用方法比如在给div取一个id为div1的id名就在div标签内写入<div id="div1"></div>,但是注意”id 的全局唯一性没有保障，就算有两个重复的 id，HTML 也不会提示我写错了，这里说的是HTML不会报错“。
style：HTML文档定义样式信息，他的用法是在<style>标签里面写入你所需要设置的样式，<style>标签有三种写法，分别是写在行间的行间样式，写在head里面的内嵌样式，和写在外部css文件里面的外联样式。
tabindex：规定元素的 tab 键控制次序，比如你需要在a标签内加入tabindex则可以实现按tab顺序切换，写法<a href=" " tabindex="1">。
title：如果内容被省略则鼠标移入省略地方显示完整内容，用法在比如在p标签内省略代码俩个字则写法是<p title="代码">Code</p>。

说完了全局属性以后，那让我们最后再来说一下HTML里面常用的内容标签有哪些吧。

内容标签

ol+li：ol的意思是有序列表，而li的意思是list item，他的写法是在ol的下面嵌套li。注ol下面只能嵌套li或另一个ol，写法

<ol>
  <li>内容1</li>
  <li>内容2</li>
  <li>内容3</li>
</ol>

ul+li：ul的意思是无序列表，他的写法是在ul的下面嵌套li。注ul下面只能嵌套li或另一个ul，写法

<ul>
  <li>内容1</li>
  <li>内容2</li>
  <li>内容3</li>
</ul>

dl+dt+dd：dl的全称是description list，他是用来描述一个东西的，dt里面是被描述的对象，dd里面是用什么数据来描述对象的，写法

<dl>
	<dt>何人知</dt>
	<dd>是个男生</dd>
</dl>

pre：定义预格式化的文本，在HTML里面如果你连续写入空格，tab等他除了第一次以外之后不会生效，但是如果你用<pre>包裹住他就可以连续写入空格，tab等，写法

<p>
	<pre>    第一个    代码    <pre>
</p>

code：文本进行格式化，他默认是一个内联元素，可以让字体等宽，如果要保留回车就配合pre使用写法

<code>
iiii
wwww
</code>

hr：水平分割线，写法直接添加标签<hr>即可实现分割线分割上下文效果。
br：用于换行，写法直接输入标签<br>即可实现换行。
a：超链接，实现页面跳转在href内输入要转入的网址，写法<a herf="www.baidu.com">百度</a>。
em：表示强调语气很重要，默认样式表示斜体，写法直接在<em>标签里面写入内容即可。
strong：表示本身很重要，默认样式是加粗，写法直接在<strong>标签里面写入内容即可。
quote：没有效果，表示引用，默认样式为内联，写法为直接在<quote>标签内写入内容。
blockquote：定义块引用，在<blockquote>标签内的内容都会从常规文本中分离出来，经常会在左右俩边进行缩进，写法就是在<blockquote>标签里面写入内容即可。

好了到这里我对HTML的历史由来介绍、如何创建一个自己的HTML还有一些我觉得一些平常比较常用的表章节的标签、全局属性这类属性的介绍就到这里了，如果觉得有什么元素需要补充或者你觉得哪些地方写的不好，可以联系我或者在下方评论，感谢大家的观看。

Dawn-s

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
《HTML常用属性》

这篇博客将介绍有关HTML的一些历史与我觉得HTML一些比较常用的表章节的标签、全局属性等，当然还将介绍如何创建一个自己的HTML文档。首先，我先向大家介绍一些HTML的历史由来：HTML它是**超文本标记语言**（它的全称是：**HyperText Markup Language**，简称：HTML）是一种用于创建网页的标准标记语言，而HTML他的发明者则是英国计算机科学家**蒂姆·伯纳斯-...
复制链接

扫一扫