初识HTML 网页的构成 vscode快捷键 常用标签 项目中文件路径 标签分类

134 阅读2分钟

1.网页构成的三要素

  • HTML标签,是构成网页的最基本的组成部分。例如,文字 图片 视频 音频等都需要标签展示在网页上。
  • css层叠样式表,负责网页的布局样式设置。例如:文字大小,文字颜色,缝隙间距,排版方式等!
  • JavaSript简称JS,负责网页的用户交互、初步学习,我们需要掌握以上三种语言的编码方式以及其各自的功能!
2.HTML:Hyper Text Mark Language扩展型超文本标记语言!!!

我们目前所学的是html 5.0 2004年10月 W3C 参考网站:www.w3school.com.

3.快捷键的使用:

  • 保存:CTRL + S 重点!!!
  • 复制:ctrl + C
  • 粘贴:ctrl + V
  • 剪切 :ctrl + X
  • 退回上一步:ctrl+z
  • 查找与替换:ctrl+f
  • 全选:ctrl+a
  • 运行程序,包括刷新网页:ctrl+R 重点!!!
  • 注释代码的快捷键:ctrl+/ 重点!!!

4.文本换行使用
标签 文本加连续空格使用转义字符  !!!!

5.标签之间的关系 父子关系 (标签相互嵌套) 兄弟关系 (标签平级)

6.访问文件,要注意路径 跟本文件同级,可以直接访问! ./可忽略 访问本文件的上级,可以写../../../...等等 ./是同级 ../是上一级

7.重点!!!

标签的分类,按照语义特性划分:
  • 块元素,独占一行;可以设置宽高;默认宽度是参考其父级标签宽度,默认高度由内容撑起! 例如:h1 h2 p等。
  • 行元素,多个行元素相邻,独占一行,宽高设置无效,其宽高由内容撑起! 例如:strong em a等
  • 行级块元素,和行元素相邻,既能共行,还可以设置有效宽高; 例如:img(此类型标签不多 遇到了单独记)
按照标签结构划分:
  1. 双标签<h1>数据写这里</h1>
  2. 单标签 例如: <img src="" /> <meta charset="utf-8"/> 单标签一般自带属性,要求把值放在属性中!!!