前端学习之HTML标签(一)

目录

HTML骨架标签

1.标签

2.lang语言种类

3.charset字符集

HTML常用标签

1.标题标签

2.段落标签

3.换行标签

4.文本格式化标签

5.div和span标签


HTML骨架标签

前言:在vsCode中,新建网页文件,输入!+回车后可生成HTML骨架标签代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

1.<!DOCTYPE>标签

<!DOCTYPE>文档类型声明标签,作用就是告诉浏览器使用哪种HTML版本来显示网页。

<!DOCTYPE html>意思是当前页面采取的是HTML5版本来显示网页。

注意:①<!DOCTYPE>声明位于文档中的最前面的位置,处于<html>标签之前。

②<!DOCTYPE>不是一个HTML标签,它是文档类型声明标签。

2.lang语言种类

lang是用来定义当前文档显示语言。en定义语言为英语(即英文网页),zh-CN定义语言为中文(即中文网页)。

3.charset字符集

字符集是多个字符的集合,以便计算机能够识别和存储各种文字。

在<head>标签内,可通过<meta>标签的charset属性来规定HTML文档应该使用哪种字符编码。

<meta charset="UTF-8" />这是必须要写的代码,以防出现乱码的情况。

charset常用的值有:GB2312、BIG5、GBK和UTF-8,其中UTF-8也被称为万国码,基本包含了全世界所有国家需要用到的字符。

HTML常用标签

1.标题标签

HTML提供了6个等级的网页标题,即<h1>-<h6>.

eg:<h1>我是一级标题</h1>

语义:作为标题使用,并且依据重要性递减。

特点:文字加粗,字号一次增大,独占一行。

2.段落标签

<p>标签用于定义段落,它可以将整个网页分为若干个段落。

eg:<p>我是一个段落标签</p>

特点:文本在一个段落中会根据浏览器大小自动换行,段落与段落之间保有空隙。

3.换行标签

<br />为换行标签,可将某段文本强制换行显示

特点:<br />是一个单标签,简单的开始新一行,而段落之间会插入一些垂直间距。

4.文本格式化标签

为文字设置粗体、斜体或下划线等效果,突出文字的重要性。

语义标签说明
加粗<strong></strong>或者<b></b>更推荐使用<strong></strong>,语义更强烈
倾斜<em></em>或者<i></i>更推荐使用<em></em>,语义更强烈
删除线<del></del>或者<s></s>更推荐使用<del></del>,语义更强烈
下划线<ins></ins>或者<u></u>更推荐使用<ins></ins>,语义更强烈

5.div和span标签

<div>和<span>是没有语义的,它们就是一个盒子,是用来装内容的。

eg:<div>这是一个头部</div>

<span>今日价格</span>

特点:①<div>标签用来布局一行只能放一个<div>,大盒子。

        ②<span>标签用来布局,但一行上可以放多个<span>,小盒子

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值