Html+css知识点
(第一篇）
在分享之前给大家讲一个关于有关于浏览器的小知识，
一个浏览器分为shell+内核两部分组成，shell就是我们平时用的操作界面，
而内核就是一个浏览器的核心技术，有独立开发内核的浏览器就被称为主流浏览器。
目前市面上成熟的主浏览器有以下五个：
IE（IE浏览器，也是常用的最多的浏览器）内核名叫trident
Firefox（火狐浏览器，一款可以手机看源代码的浏览器） 内核名：Gecko
Google Chrome(谷歌浏览器，浏览器中的佼佼者) 内核名：webkit/blink
Safari （苹果浏览器） 内核：叫blink
Opear (欧朋浏览器，来自挪威) 内核名：presto
<!--下面我所讲的内容都是按照正常的学习顺序去走的-->
1、save 或 ctrl+s，保存，存文件一定要加.html
2、Hypertext Markup Language 超文本标记语言
3、<html></html>根标签
4、<head></head>里面放的是思想，设置浏览器用的，是人看不到的
5、<body></body>是展示给用户看的
可以右键打开 Open in Browser
6、这就是一个属性：属性名 = “属性值”
属性名不用加双引号，属性值必须加双引号
<meta charset = “utf-8”>一般都填这个
编码字符集：gb2312 国家编码字符集（简体，亚裔字符集）
gbk（gb2312+繁体）
unicode 是万国码，包括了所有国家的语言
uft-8 是 unicode
7、<title>智学无忧</title> 标题标签
8、<html lang = “en”>告诉搜索服务器，我们的网页是讲什么的
en 代表是英文，zh 是中文，德语是 de
<p></p>段落标签，让内容成段展示
9、标题标签，成段展示，独占一行，加粗字体，更改字体大小（从 1 到 6 依次减小）
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
10、<strong>加粗</strong>
<em>斜体</em>
例又加粗又斜体，写成嵌套功能
<strong>
<em>又加粗又斜体</em>
</strong>
11、<div></div>独占一块
12、<span></span>独占一行
div 和 span 这两个标签是为了成块展示，规格化，这两个就是容器
功能如下：
功能 1：分块明确，让整个页面更加结构化；
功能 2：捆绑操作的作用）
13、空格的含义是英文单词分隔符，不代表文本的空格，作为分隔符，打多少个都只显示一个空格；
回车也是文字分割符，也是打多少个都只显示一个空格
14、html 编码格式是&；下面三个是比较常用的
1: 空格文本，写多少个就空几格
2:<左尖角号，小于的意思， 代码是<
3:>右尖角号，大于的意思， 代码是>
15、大部分标签的作用是把在他里面包着的文本变成设置好的样子，所以成对出现，有的标签自己就代表功能，就是单标签
例如：
<hr/>水平线
<br/>换行符
17、有序列表
喜欢的电影
<ol>
<li>功夫</li>
<li>极限特工</li>
<li>返老还童</li>
<li>阿里波特</li>
</ol>
如果写成：<ol type = “1”> 就以 ABC 排序， 改成 a，就以 abc 排序
type 值只有五个：数字，大写英文 A，小写英文 b，罗马数字大写 I，罗马数字小写 i
写成<ol type = “1” reversed = “reversed”> 就是倒序
如果想从第 2 个开始排序，就写<ol type = “1” start = “2”>
如果想从第 100 个开始排序，就写<ol type = “i” start = “100”>
想从第几个开始算，start 里面写数字几
18、无序列表 ul，unorder list 只有 type = “”这一个属性可以改
<ul type = “disc”>
<li>草莓</li>
<li>苹果</li>
<li>橙子</li>
</ul>
如 type = “disc” 意思是 discircle，实心圆
如 type = “square” 意思是 square，实心方块
如 type = “circle” 意思是 circle，圈(空心圆)
ul 和 li 是一个很好的天生父子结构，可以做导航栏
19、<img src = “123.jpg>
20、src 是 source 的缩写，img 的地址分：
1、网上 url
2、本地的绝对路径
3、本地的相对路径
如 html 和图片在同一文件下，是一种相对关系，相对路径，写法<img src = “123.jpg”>
D:/a/b/lesson1.html
D:/a/b/123.jpg
如 html 和图片不在同一文件下，是绝对路径，写法<img src = “D:/a/b/c/123.jpg”>
D:/a/b/lesson2.html
D:/a/b/c/123.jpg
例<img scr = “hh.jpg” alt = “这是苹果”>
这里的 alt 是图片占位符。当地址出错时，图片看不见了，来展示这个信息；如果图片没问题，就不会展示这个信息
例<img scr = “hh.jpg” alt = “这是苹果” title = “苹果”>
此处的 title 是图片提示符。当鼠标放上去，就会显示这个信息