HTML基础知识
浏览器
浏览器是网页显示和运行的平台
常用的浏览器以及内核
- 谷歌浏览器,内核Chromium
- IE浏览器 ,内核Trident
- 火狐浏览器,内核Gecko
…
认识HTML
HTML是用来描述网页的一种超文本标记语言
代码编辑工具
VScode、WebStorm、Dreamweaver、SublimeText
文档类型
用法
<!DOCTYPE html>
作用
位于文档中的最前面的位置处于所有标签之前
在网页中要把文字有条理地显示出来
页面语言
<html lang="en"> 指定html语言种类
en 定义语言为英语
zh-CN 定义语言为中文
字符集
用法
<meta charset="UTF-8" />
定义
字符集(Character set)是多个字符的集合
utf-8是目前最常用的字符集编码方式,还有gbk和gb2312
这句代码非常关键是必须写代码否则可能引起乱码的情况
认识WEB
Web网页主要由文字图像超链接以及音频视频Flash等元素构成
Web标准
Web标准构成
1.结构,用于对网页元素进行整理和分类,主要是HTML
2.表现,设置网页元素的版式颜色大小等外观样式,主要是CSS
3.行为,是指网页模型的定义及交互的编写,主要是Javascript
为什么要遵循WEB标准?
不同浏览器内核不同显示页面或者排版有差异
Web 标准的好处?
1、让Web的发展前景更广阔
2、内容能被更广泛的设备访问
3、更容易被搜寻引擎搜索
4、降低网站流量费用
5、使网站更易于维护
6、提高页面浏览速度
路径
目录
目录文件夹
就是普通文件夹里面存放了我们做页面所需要的相关素材
根目录
打开目录文件夹的第一层
分类
相对路径
以引用文件之网页所在位置为参考基础,而建立出的目录路径
绝对路径
绝对路径以Web站点根目录为参考基础的目录路径
指当所有网页引用同一个文件时,所使用的路径都是一样的
元素标签
标签分类
双标签(常规元素)
<标签名> 内容 </标签名>
分为开始和结束标签,结束标签只是在前面加了一个关闭符“/”
骨架标签
html标签
<html></html>
页面最大标签也叫跟标签
头部标签
<head></head>
head标签中必须包含title标签
网页标题
<title></title>
让页面拥有属于自己的网页标题
主体标签
<body></body>
元素包含文档的大多页面内容都放到body里
关系
嵌套关系
<head>
<title></title>
</head>
并列关系
<head></head>
<body></body>
单标签(空元素)
样式
<标签名 />
空元素用单标签表示里面不需要包含内容
排版标签
标题标签
<h></h>
HTML提供了6个等级的标题
即标题标签语义: 作为标题使用,并且依据重要性递减
加了标题的文字会变的加粗,字号也会依次变大
一行是只能放一个标题的
段落标签
<p></p>
是html中最常见标签,文本在段落中据浏览器窗口大小自动换行
作用
把 HTML 文档分割为若干段落
水平线标签
<hr/>
是单标签,在网页中用水平线将段落与段落隔开使文档结构清晰
换行标签
<br/>
一个段落的文字会从左到右依次排列直到浏览器窗口的右端然后自动换行。如果希望某段文本强制换行就需要使用换行标签
div和span标签
语法格式
<div></div> <span></span>
作用
用来布局网页元素
区别
一行只能放一个div,一行上可以放好多个span
图像标签
语法
<img src="图像URL" />
该语法中src属性用于指定图像文件的路径和文件名
链接标签
<a href="跳转目标" target="目标弹出方式">文本或图像</a>
注释标签
<!-- 注释语句 -->
快捷键
ctrl + / 或者 ctrl +shift + /
表格标签
语法
<table>
<tr>
<td></td>
</tr>
</table>
属性
border边框、width宽度、height高度
表头
<th></th>
标题
<caption></caption>
合并
跨行合并(纵向合并)
rowspan
跨列合并(横向合并)
solspan