Web前端之标签 day01

/ web前端 / 没有评论 / 274浏览
web前端之标签

自我介绍 :

SanLang
Email: wx@booae.com

课程介绍

第一部分 前端页面

前端介绍

学习方法

将大练习为复重点,照着代码写实现步骤 照着步骤写新的代码

HTML

HTML文件的结构

<!DOCTYPE html><!-- 文档声明:负责告诉浏览器 
使用html的哪个版本来解析内容 ,
此写法告诉浏览器以h5的标准解析-->
<html><!-- 根标签,除了文档声明所有的标签都在html标签内部 -->
    <head><!-- 头标签:里面的内容是给浏览器看的 -->
        <meta charset="UTF-8"><!-- 设置页面的字符集 -->
        <title>第一个html文件</title><!-- 设置页面标题 -->
    </head>
    <body><!-- 体标签:里面的内容是给用户看的 -->
    </body>
</html>

HTML常用的标签

文本标签

  1. ......
    内容标题标签
  2. 段落标签

  3. 水平分割线
  4. 换行

列表标签


代码效果:



代码效果:


代码效果:


分区标签div和span

分区标签自身没有任何显示效果,可以理解成是个容器,此容器用于装各种标签
通过分区标签把页面划分成多个区域,便于对页面中的标签进行同意管理

- 在html5的标准中新增了几个分区标签

<body>
  <header></header>
  <article></article>
  <footer></footer>
</body>

元素(标签分类)

  1. 块级元素:独占一行 包含:div,h1-h6,hr
  2. 行内元素:共占一行

行内元素空格折叠现象

常见特殊字符

图片标签

代码效果:


图片地图

代码效果: