html学习

浏览器了解

浏览器的作用：代码转化页面

浏览器的核心：浏览器内核===渲染引擎

• 解析网页语法 并显示网页

浏览器内核

Trident :IE、360安全浏览器、百度浏览器

Gecko:火狐

Webkit:Safari、移动端浏览器（ISO、Android）

Webkit–>Blink（速度快）谷歌

邂逅html

html:超文本标记语言

超文本：可以插入图片、音频、视频、超链接

html>head(title)===body

可以使用 bing.com 搜索问题

缩进空格：2

选中一堆文字 按住tab键 会整体向右缩进

同时按住tab+shift 会向左整体缩进

认识元素

标签+标签的属性+内容 p标签+中间内容

helloworld

单标签

元素的属性 class a标签的 href属性

alt+shift+向下箭头和向上箭头 向上复制向下复制

标点符号：搜狗输入法 设置中文下使用英文符号

!DOCTYPE html 文档类型声明 html上方的一个声明 告诉浏览器当前页面是html5页面 让浏览器用html5标准去解析识别内容

html就是根元素 lang语言的属性 设置语言 zh-CN 、en

:root伪类选择的就是根元素

head规定文档的配置信息 (元数据)

• title网页的标题
• meta 设置字符编码 utf-8(meta charset=“UTF-8”) 不设置会导致乱码.计算机把元素图片 通过utf-8编码把元素转化0101 最后解码显示

body

h元素h1-h6 标题统称 浏览器呈现的时候是给不同的标签添加不同的样式

p元素 段落 多个段落间有距离 是因为添加的css类里面的margin-top margin-bottom 其实两个段落的margin-top和margin-bottom还会合并

img元素 单标签元素 src :source来源 img是可替换元素 通过src 指向资源 把资源占据当前的元素 alt:资源加载不成功显示的文字内容、 屏幕阅读器给使用者听

网络图片

本地图片

• 相对路径：文件相对当前文件的位置
• 绝对路径：根盘符查找，一直到找到资源

a元素 href（超文本引用）:指定要打开的url地址或者本地地址

target:_blank或者self

跳转到某个元素ss的位置 需要给该元素定义一个id=“name”

点击该a元素会跳转到ss的位置 href=“#name”

a元素和img元素结合 a>img

href=“.zip” 会下载这个压缩包

iframe 在一个html文档里面可以嵌套其他的文档

iframe src width=“800” height=“600” frameborder="0或者1"显示或者不显示边框

也可以给自己的网页设置 禁止iframe 响应头的一个属性

_self当前页面打开 blank空白页面打开 parent 父级嵌套的页面打开（一般和iframe一起使用）top代表顶级的页面

div 盒子 大盒子包裹对应的内容 可以给他样式

span 包裹文字 可以和其他文字同一行显示 给其添加对应的样式

strong 加粗 强调

i让内容倾斜 br 换行

html的全局属性

id:唯一标识符 锚点链接 脚本获取元素 样式

class: 类名 添加样式 通过类选择器或者dom方法来选择和访问特定的元素

style: 添加内联样式

title: 鼠标放上去给提示title的内容

字符实体

浏览器解析字符 < 这个是保留符号 艾特符号+nbsp+分号（空格） &+lt|gt+; 大于号

<  

url地址

协议：//主机：端口/路径/文件名?查询#片段 id

uri标识符

url地址

元素语义化

SEO优化

认识字符编码

计算机只认识010101二进制数字

文字—(字符编码)–>计算机语言10101----(字符解码)—>文字(自然语言)

utf-8