1、字符集(charset)
-编码和解码所采用的规则称为字符集
2、乱码问题:
-如果编码和解码所采用的字符集不同就会出现乱码
3、常见的字符集
-ASCII GBK UTF-8
可以通过meta标签来设置页面的字符集
在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格,在HTML中有些时候,我们不能直接书写一些特殊符号,比如:多个连续的空格,比如字母两侧的大于和小于号。如果我们需要在网页中书写这些特殊的符号,则需要使用html中的实体(转义字符)
实体的语法:&实体的名字;
空格
> 大于号
< 小于号
© 版权符号
meta主要用于设置网页中的一些元数据,元数据不是给用户看
网站的描述会显示在搜索引擎的搜索的结果中
title标签的内容会作为搜索结果的超链接上的文字显示
在网页中HTML专门用来负责网页的结构,所以在使用html标签时,应该关注的是标签的语义,而不是它的样式。
标题标签:
em标签用于表示语音语调的一个加重 有倾斜字体效果 与i标签效果一样
strong表示强调,重要内容!有加粗效果 与b标签效果一样
blockquote 表示一个长引用 快元素
q表示一个短引用 行内元素
在页面中独占一行的元素称为块元素(block element)
块元素(block element)
行内元素(inline element)
注意:浏览器在解析网页时,会自动对网页中不符合规范的内容进行修正
比如:
标签写在了根元素的外部
p元素中嵌套了块元素
根元素中出现了除head和body以外的子元素
布局标签(结构化语义标签)
在html中也可以创建列表,html列表一共有三种:
有序列表
无序列表
定义列表
列表之间可以互相嵌套
超链接可以让我们从一个页面跳转到其他页面,或者是当前页面的其他的位置
使用 a 标签来定义超链接
href 指定跳转的目标路径
值可以是一个外部网站的地址
也可以写一个内部页面的地址
target属性,用来指定超链接打开的位置
可选值:
_self 默认值 在当前页面中打开超链接
_blank 在一个新的要么中打开超链接
超链接是也是一个行内元素,在a标签中可以嵌套除它自身外的任何元素
超链接另一种用法
可以直接将超链接的href属性设置为#,这样点击超链接以后,页面不会发生跳转,而是转到当前页面的顶部的位置。
可以跳转到页面的指定位置,只需将href
属性设置 #目标元素的id属性值
id属性(唯一不重复的)
去底部
去第三个自然段
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
在我的后园,可以看见墙外有两株树,一株是枣树,还有一株也是枣树。 这上面的夜的天空,奇怪而高,我生平没有见过这样奇怪而高的天空。
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quia quasi numquam quam molestias cumque eveniet ab nobis doloribus dolores. Nesciunt, distinctio tempore similique consequuntur nulla dolorem sapiente minus praesentium impedit.
回到顶部
图片标签用于向当前页面中引入一个外部图片,使用标签来引入外部图片,
标签是一个自结束标签,
标签这种元素属于替换元素(块和行内元素之间,具有两种元素的特点)
属性:
注意:
图片的格式:
jpeg(jpg)
- 支持的颜色比较丰富,不支持透明效果,不支持动图
- 一般用来显示照片
gif
- 支持的颜色比较少,支持简单透明,支持动图
- 颜色单一的图片,动图
png
- 支持的颜色丰富,支持复杂透明,不支持动图
- 颜色丰富,复杂透明图片(专为网页而生)
webp
- 这种格式是谷歌新推出的专门用来表示网页中的图片的一种格式
- 它具备其他图片格式的所有优点,而且文件还特别的小
- 缺点:兼容性不好
base64
- 将图片使用base64编码,这样可以将图片转换为字符,通过字符的形式来引入图片
- 一般都是一些需要和网页一起加载的图片才会使用base64
选择图片的原则:效果一样,用小的。效果不一样,用效果好的。
内联框架,用于向当前页面中引入一个其他页面,现在用的不多
audio 标签用来向页面中引入一个外部的音频文件的,音视频文件引入时,默认情况下不允许用户自己控制播放停止
属性:
使用video标签来向网页中引入一个视频,使用方式和audio基本上是一样的
示例代码:
关注公众号“哥伦布日记”,即可获得更多干货!赶快行动吧。