HTML5学习干货分享

小圆2023090237

已于 2024-10-09 23:10:49 修改

阅读量618

点赞数 18

文章标签： html5 学习前端

于 2024-09-09 22:33:23 首次发布

本文链接：https://blog.csdn.net/Wjunnn/article/details/142067508

版权

HTML5基础知识

HTML是什么
HTML5语法结构
标签

HTML是什么

HTML是HyperText Markup Language的简写，表示超文本标记语言
1.HTML并不是一个种编程语言，而是一种标签语言
2.HTML的文档也叫web页面
3.HTML使用标记标签来描述网页
HTML文档由HTML标签构成，每个标签可以包含一些内容或其他标签，这些标签可以帮助浏览器解析文档内容并显示出来。

HTML5语法结构

标签(tag)使用一对尖括号"<“和”>“括起来的单词或单词缩写，各种标签的效果差别很大，但总的表示形式却大同小异，大多数标签都成对出现。
在HTML中，通常是由开始标签和结束标签组成，开始标签用”<标签>“表示，结束标签用”</标签>'表示。
HTML-标签举例
注意！

每个标签都要用“<”和“>”括起来表示这是HTML代码。且尖括号与标签名之间不能有空格或其他字符。
在标签名前加上“/”表示标签的结束。标签中也有不用结束标签结尾的，称为单标签。

标题文字标签

在页面中，标题是一段文字内容的核心，所以总是用加强的效果来表示。网页中的信息可以分为主要点、次要点，可以通过设置大小不同的标题，增加文章的条理性。
标题文字标签的格式为

<h# align="left |center |right">标题文字</h#＞

“#”用来指定标题文字的大小，取1～6之间的整数值，成对出现的标题文字标签中的数字必须一致。＃取1时文字最大，取6时文字最小。例如：

<h1 align="center "> 一级标题</h1>

属性 align用来设置标题在页面中的水平对齐方式，包括left（左对齐）、center（居中）或right（右对齐），一般默认为life。
＜h#>.＜/h#>标签默认显示宋体，在一个标题行中无法使用不同大小的字号。
例如：

<! doctype html> <html>
<head>
<title>标题示例</title>
</head>
<body>
<h1>一级标题</h1>
<h2>二级标题</h2>
＜h3>三级标题</h3>
＜h4>四级标题</h4>
<h5 align="right">五级标题右对齐</h5>
<h6 align="center">六级标题居中</h6>
</body>
</html>

其网页展示效果为：
标题文字标签举例

排版元素标签

段落标签

在网页中要把文字有条理地显示出来，离不开段落标记，就如同用户平常写文章一样，整个网页也可以分为若干个段落，而段落的标签称为。是 HTML 格式中特有的段落元素，在 HTML. 格式里不需要在意文章每行的宽度，不必担心文字是不是太长而被截掉，它会根据窗口的宽度自动转到下一行。段落标签的格式为：
文字格式中的“|”表示“或者”，即多项选其一。

换行标签

在HTML 中，一个段落中的文字从左到右顺序排列，到浏览器窗口的右端后自动换行。如果希望某段文本强制换行显示，就需要使用换行标签 。
＜br/>标签将打断 HTML文档中正常段落的行间距和换行。<br/＞放在任意一行中的任意位置都会使该行从该位置换行，如果 放在一行的末尾，则下一行开始的文字、图像、表格等仍在下一行显示，而又不会在行与行之间留下空行，即 是强制文本换行。换行标签的格式为

文字 <br/>

浏览器解释时，从该标签处换行。换行标签单独使用，可以使页面清晰、整齐。

<body>
联系人<br/>
家庭住址<br/>
电话
</body>

换行标签举例

文本化标签

在网页中，有时需要为文字设置粗体、斜体或下画线效果，这时就需要用到 HTML 中的文本格式化标记，使文字以特殊的方式显示。

<p>正常显示文本</p>
<p><b>定义文本加粗</b></p>
<p><strong>定义强调文本</strong></p>
<p><i>定义倾斜文本</i></p>
<p><del>定义删除线文本</del></p>
<p><ins>定义下划线文本</ins></p>

其网页展示效果为：
文本化标签举例

水平线标签

在网页中常常能看到一些水平线将段落与段落之间隔开，使文档结构清晰、层次分明。这些水平线可以通过插入图片实现，也可以简单地通过标签来完成。＜hr/＞就是创建横跨网页水平线的标签，水平线标签的格式为：

＜hr align="left |center |right" size="横线粗细" wiath="横线长度" color="横线色彩“ noshade="noshade"/>

<hr/>是单标签，在网页中输入一个<hr/>，就添加了一条默认样式的水平线。

属性	描述
align	设置水平线的对齐方式，有left，right，cente三种选择
size	设置水平线粗细，单位是像素（px），一般默认为2像素
color	设置水平线的颜色，可通过颜色名称、十六进制#RGB、rgb（r,g,b）设置
width	设置水平线宽度，可以是确定的像素值，也可以是浏览器窗口的百分比，默认为100%
noshade	设置线段是否有阴影