浏览器内核，html入门——前端自学day01~day02

浏览器内核

前端的所有工作都是建立在浏览器内核上的，浏览器内核主要包括两部分：渲染引擎和JS引擎。渲染引擎负责处理html和css。JS引擎则时JavaScript。

网页的构成

HTML主要负责网页的布局，CSS负责网页的效果，Javascript负责网页交互作用。
因此，一个网页应该有三部分组成，index.html，style和Scripts，此外需要其他文件夹用来存放图片等其他东西。

HTML

HTML是超文本标记语言 Hypertext Markup Language 可以用来处理段落文字，图片等。基本结构是元素，每个元素的结构如下：

<> 内容 </>

由开始符，结束符和内容构成，开始符内可以添加属性名和值以实现不同的效果。

如果没有结束符说明是空元素（问题1 不太懂空元素例如<img,str=" ">）
元素标签之间可以嵌套 ，元素内部可以有属性，包括属性名和属性值，例如：
< a href = “http://www.baidu.com”>百度网址< /a >

HTML大体结构

html 是根标签
跟在后面的是 head 标签
head 标签里有中经常放下面的东西

• tittle 标签 用来标记网站的名字（文档标题）
• icon 标签 网页标签前的小图片
• meta 标签 指元数据，规定一些字符等必须信息
• link 标签 指定css的样式位置
• script 标签 制定script交互行为

上述标签还有其他许多用途，并不全面，主要的作用是这样。

head 之后是 body 标签
body 标签主要用来处理文字，凸显重要信息等。

• h1~h6 标签 大标题，常用的是 h1~h4
• p 标签 用来分段
• li标签 列表标签，搭配无序列表 ul 和有序列表 ol 一起使用
• a 标签 超链接标签
• u 、b 、i 标签 分别是下划线、粗体、斜体
• em 、strong 标签 分别是着重和强调
  
  文字排版进阶部分
• dl、dt、dd 标签 表示描述列表 可以显示不同的缩进
• blockquote 标签 块引用，用于引用一大段话
• q 标签 字引用 永远短小的话的引用 加冒号
• cite 标签 引用
• per 标签 保留空白符
• time 标签 时间格式标签
• sup 上标 sub 下标
• abbr标签 缩略语，鼠标放上去会显示标签内的内容，类似于某些标签的tittle元素
• address author 地址，作者标签
• code var kbd samp 代码 变量 键盘键入 计算机程序输出

上述标签是html的大部分有用的，有意思的标签，并不是全部的html标签，可以参考
MDN的文档

i 和 em 及 cite、b 和 strong 的区别

虽然上述两组标签的表现形式一致，但原理上是不同的。
b 标签的表现形式是加粗， strong 标签是指逻辑上的加粗
i 和 em 也是同理，em 着重的是逻辑上的强调，cite 在语义上表示引用，同斜体不同。

超链接的引用

标签 < a >< /a >主要有两个属性 href(hypertext reference缩写) 和 title
href主要引用的为 URL统一资源定位符（Uniform Resource Locator） 对于一个网站类型的URL 主要包括
http协议：http:// or https://、域名、（端口）、（路径）、（其他信息）
URL有绝对路径和相对路径两种
绝对路径是从协议开始进行查找
相对路径是从根目录下开始查找（问题2，是所处页面的根路径还是根页面的根路径？）
对于一些网站的附属页面，应优先考虑相对路径，虽然绝对路径更可靠，每次寻找需要从头开始，耗费其他的开销

总结

两天的时间因为杂七杂八的事情实际上只学了完整的一天左右，也懂了一些简单的页面构成，主要有两个问题

1. 不太懂空元素例如< img,str=" ">
2. 相对路径是所处页面的根路径还是根页面的根路径？

简单的看了一下还需要学的内容大概还需要2~3天就可以结束了。