首页 > 其他分享> > 我的前端学习历程01HTML基本标签

我的前端学习历程01HTML基本标签

2021-09-18 11:00:28 作者：互联网

前言

我认为学习前端要把基础打好，优秀的前端工程师一定会有一个扎实的HTML基础，这是我的学习笔记，有什么的遗漏可以帮忙补充！

提示：以下是本篇文章正文内容，下面案例可供参考

一、HTML的基本骨架

HTML学的好，基本骨架认识深刻还要早

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<mate charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

<!DOCTYPE html > 该标签是声明该文档为html5 版本类型，也是HTML中唯一一个大写的标签。

< html lang=“zh-CN”></html> 这是html的主体，也叫做根标签。lang为html的语言信息，一般写成 en(英语)、zh-CN(简体中文)

< head >< /head>这是html里面的头标签

< mate charset=“UTF-8”> 该标签为单标签 chartset字符格式属性必须要设置，不然会导致乱码，常用的字符格式有 UTF-8,GBK,GB2312…一般使用（万国码）UTF-8。

< title> 标题</title> 标题标签 html的标题,和 mate 标签都写在 head 标签里面

< body></body> 主题标签，页面元素都写在body标签里面

二、常用标签

1.标题标签

标题标签为双标签，块级标签，独占一行。标题标签有6个，分别是h1~h6，h1标签最大，依次变小
写法为: <h1> 内容</h1>

h1标签

h2标签

h3标签

h4标签

h5标签

h6标签

常用属性为 align 水平对齐方式 left左对齐 center居中 right右对齐
写法:<h1 align="center"></h1>

左对齐

居中

右对齐

2.段落标签

p标签也是块级标签，双标签，
写法：<p></p>

3.div标签

div标签也叫布局标签,也是块级标签，独占一行

<div>div1</div> 
<div>div2</div>

例如：

div1 div2

4.span标签

行标签，当该行写满之后才会换行

<span>1</span><span>2</span>3<span3>

例如：12

5.字体加粗

b标签和strong标签
两个标签作用都是加粗，b标签是视觉效果上加粗了，而strong是画出重点，作用上不一样

<b>这里是b标签</b>
<strong>这里是strong标签</strong>

不加粗
这里是加粗的b标签
这里是加粗的strong标签

6.斜体

i标签和em标签
两个都是斜体，作用和字体加粗大同小异

<i>这里是斜体i</i>
<em>这里是斜体em</em>

7.删除线

s标签和del标签
两个都是删除线

<s>这是删除线s</s>
<del>这是删除线del</del>

~~这是删除线s~~
~~这是删除线del~~

8.换行符

br标签,单标签

sdufu<br/>sfbdfaudf

sdufu
sfbdfaudf

9.水平线

hr标签，单标签，用于分割文字
属性有color 颜色、width 长度(默认占一行的长度)、align 水平对齐方式（默认水平居中）、size宽度

<hr color="red" width="100px"/>

例如：

总结

要多敲，多练。好记性不如烂笔头，赶紧去敲代码吧

标签：HTML,标签,前端,html,加粗,对齐,strong,01HTML
来源： https://blog.csdn.net/doiwed/article/details/120360451