HTML 标签

1.站点的创建

站点的创建 ( 一个大的文件夹里面四个小的文件夹 : img 文件夹 , css 文件夹 , js 文件夹 , html 文件夹; 和一个小的页面文件: index.html 文件 )

2.快速创建页面结构

快捷键 : shift+!+tab

快捷键 : html:5

3.结构注释语句

快捷键 : ctrl+?

4.标签的含义

HTML 标签, 也称之为元素, 也称之为记号. 三个名字都是同样的意思

5 .标签的基本语法

5.1 单标签

基本语法 : <标签名字 属性="属性值" 属性="属性值" 属性 ="属性值">

5.2 双标签

基本语法 : <标签名字 属性="属性值" 属性="属性值" 属性="属性值"></标签名字>

6. 标签的特点

1. 所有的标签都需要使用尖角号

2. 单标签只有开始没有结束, 双标签有开始有结束

3. 属性和属性值放在开始位置处

4. 属性和标签名字之间必须带空格

5. 属性和属性值之间使用等号链接

6. 属性值需要带引号

7. 每一组属性和属性值之间需要带空格

8. 标签可以带一个属性也可以带多个属性甚至一个都不带

7.常用标签

7.1 标题标签

<!-- HTML中使用<h1>、<h2>、<h3>、<h4>、<h5>、<h6>等标签来定义标题部分，其语义格式如下 基本语法：<hn 属性="属性值">标题文档</hn> -->

<!-- 语法如下 -->

  <h1>一级标题</h1>
  <h2>二级标题</h2>
  <h3>三级标题</h3>
  <h4>四级标题</h4>
  <h5>五级标题</h5>
  <h6>六级标题</h6>

<!-- 运行结果如下 -->

7.2.段落标签

<!-- 浏览新闻网页的时候，经常能看见文章段落，经常使用<p>标签实现 基本语法：<p 属性="属性值">段落文本</p> -->

<!-- 语法如下 -->

<p>一段话·············</p>

<!-- 运行结果如下 -->

7.3 文本格式化标签

<!-- 文本格式化标签就是针对文本进行各种格式化的标签，如加粗，斜体，上标，下标等 -->

文本格式化标签

标签	文本显示效果
<strong>	强调加粗
<em>	强调斜体
<sub>/<sup>	上标文本、下标文本
<del>	加删除线方式
<ins>	加下画线方式

7.3.1 strong

<!-- <strong>标签将文本定义为语气更强的强调语气 -->

<!-- 语法如下 -->

<strong>你好，世界</strong>

<!-- 运行结果如下 --> 

7.3.2 em斜体

<!-- 语法如下 -->

    <em>你好，世界</em>

<!-- 运行结果如下 --> 

7.3.3 sub和sup 上标和下标

<!-- 上标：中间的字符在上方，多用于数学中的次方 -->

<!-- 下标：中间的字符在下方，多用于化学中的符号和公式 -->

<!-- 语法如下 -->

 2<sup>5</sup>
 H<sub>2</sub>O

<!-- 运行结果如下 --> 

7.3.4 del和ins 删除线和下划线

<!-- 语法如下 -->

<del>你好，世界</del>
<ins>你好，世界</ins>

<!-- 运行结果如下 --> 

7.4 引用标签

引用标签分类

标签	作用
<blockquote>	引用大段的段落解释
<q>	引用小段的段落解析
<abbr>	缩写或首字母缩略语
<address>	引用文档地址信息
<cite>	引用著作的标题

7.4.1 blockquote和q

<!-- 语法如下 -->

<q>那个夏天的蝉鸣比哪一年都聒噪，教室窗外枝桠疯长，却总也挡不住烈阳。</q> 
     <blockquote>
    附中明理楼顶层的大课间向来吵闹，高二A班的学委从走廊漂移进教室，叫道:“报--咱班要进人了!""敬事房的小太监又来骗人了。”有人揶揄
    "你他妈才小太监，我说真的。
    "又不是期中又不是期末的，进什么人?"
    “转校生啊。
    </blockquote>

<!-- 运行结果如下 --> 

7.4.2 abbr

<!-- 语法如下 -->

 <abbr title="">某某</abbr>
    <address>晋江文学城</address>
    <cite>木苏里某某</cite>

<!-- 运行结果如下 --> 

7.4.3 address和cite

<!-- 两个标签的效果都为斜体 -->

<!-- 语法如下 -->

 <abbr title="">某某</abbr>
    <address>晋江文学城</address>
    <cite>木苏里某某</cite>

<!-- 运行结果如下 --> 

7.5 水平线标签——hr

水平线标签属性

属性名	含义	属性取值
align	水平对齐方式	可选择left,right,center三个值，默认为center，居中对齐
size	水平线粗细	以像素（px)为单位，默认2px
width	水平线宽度	确定的像素值或浏览器窗口的百分比（默认为100%）
color	水平线颜色	颜色名称，十六进制#RGB,rgb(r,g,b)

<!-- 语法如下 -->

  <hr color="red" width="100px" size="3px" align="center" >

<!-- 运行结果如下 --> 

会持续更新！但是最近在学JS，没有太大的动力！