HTML-常用基础标签1

157 阅读2分钟

HTML-HTML基础

一、HTML基础结构

1、基础结构:也称之为基础骨架,任何东西都会有对应的一个基础结构, 基础结构是构成网页最基础最简单的代码。

2、查看基础结构:浏览器中右键->检查,基础代码如下:

image.png

二、HTML相关语法

1、标记:标记分为双标记和单标记

(1)双标记,格式如下:

<标记  属性=“属性值”  属性=“属性值”>文字内容</标记>

(2)单标记,格式如下:

<标记  属性=“属性值”  属性=“属性值” />

2、HTML标签特点

(1)无论单双, 所有标签都放在尖角号里面

(2)标记和属性之间必须带空格

(3)可以放置一个属性或者多个属性或者不放属性,并且不分先后

(4)属性和属性值之间使用等号(“=”)链接

(5)每一组属性和属性值使用空格分割

(6)双标签必须带结束标记斜杠(“/”)

三、HTML标签讲解

HTML常用标签

image.png

1、加粗标签一般使用strong标签,因为其更加具有语义化

2、倾斜标签一般使用em标签,因为其更加具有语义化

3、删除线标签一般使用del标签,因为其更加具有语义化

4、水平线用来分割上下两个区域,具体注意事项有:

1、默认情况下宽度占屏幕的一整行
2、水平线默认带阴影,该阴影可取消,标签属性:
<hr noshade="noshade">
3、水平线可更改颜色,标签属性:
<hr color=" ">
4、水平线可以调整宽度,标签属性:
<hr width="200px">
5、水平线设置宽度后,默认水平居中,可调整水平对齐方式,属性如下:
<hr width="200px" align="left/right/right">
6、水平线可设置高度,标签属性:
<hr size="200px">

5、标题标签

(1)特点:

  • 双标签
  • 共有六个级别,h1最大,h6最小
  • 默认加粗的效果
  • 独占一整行

(2)各级别标题标签的应用场景:

  • h1===文章的大标题/logo
  • h2===副标题,大模块标题
  • h3===副副标题,小模块标题
  • h4-h6===根据实际开发情况决定使用

可用快捷键

1、p+tab --->书写一个 p 标签

2、p*3+tab --->书写三个 p 标签

3、h$*6 --->一次性书写h1-h6标题标签

4、p{文本}*3 --->书写三个带相同文本 p 标签

5、h${文本}*6 --->一次性书写带相同文本的h1-h6标题标签