前端笔记1.0
1.HTML小记，
1. 概述：
<h1></h1>就是标题标签
3. <p></p>是段落标签。
4. 网页上那张小女生的图片，由img标签来完成的，
它在网页上的代码写成<img src="1.jpg">
5.html中的标签一般都是成对出现的，分开始标签和结束标签。结束标签比开始标签多了一个/。
如：
<p></p>
标签与标签之间是可以嵌套的，但先后顺序必须保持一致，如：<div>里嵌套<p>，那么</p>必须放在</div>的前面。如下图所示。
6. . HTML标签不区分大小写，<h1>和<H1>是一样的，但建议小写，因为大部分程序员都以小写为准。
7.什么是代码注释？代码注释的作用是帮助程序员标注代码的用途
语法：
<!--注释文字 -->
8. <body>标签，网页上显示的内容放在这里
9.标题标签一共有6个，h1、h2、h3、h4、h5、h6分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。<h1>是最高的等级。
10. 加入强调语气，使用<strong>和<em>标签
<em> 默认用斜体表示，<strong> 用粗体表示。
2. <span>标签是没有语义的，它的作用就是为了设置单独的样式用的。
11. 1. <q>引用文本</q> ; 注意要引用的文本不用加双引号，浏览器会对q标签自动添加双引号。
2. <blockquote>标签，长文本引用 语法：<blockquote>引用文本</blockquote> （浏览器对<blockquote>标签的解析是缩进样式）
3.在需要加回车换行的地方加入<br />，<br />标签作用相当于word文档中的回车。
4.要想输入空格，必须写入 。
5.<hr>标签，添加水平横线。html4.01版本: <hr> xhtml1.0版本: <hr />
注：<hr />标签和<br />标签一样也是一个空标签，所以只有一个开始标签，没有结束标签。
6. <address>标签，为网页加入地址信息
语法：<address>联系地址信息</address>
7.使用<code>标签,当代码为一行代码时，你就可以使用<code>标签，注：如果是多行代码，可以使用<pre>标签。
语法：<code>var i=i+300;</code>
语法： <pre>语言代码段</pre>
12.使用ul，添加信息列表
1.ul-li是没有前后顺序的信息列表。
<ul>
<li>信息</li>
<li>信息</li>
......
</ul>
2. ul-li在网页中显示的默认样式一般为：每项li前都自带一个圆点，如:
3.<ol>标签来制作有序列表来展示。
语法：
<ol>
<li>信息</li>
<li>信息</li>
......
</ol>
如：
4.把一些独立的逻辑部分划分出来，放在一个<div>标签中，这个<div>标签的作用就相当于一个容器。
语法：<div>…</div>
5. 给div命名 <div id="版块名称">…</div>
6.创建表格的四个元素：
table、tbody、tr、th、td
1、<table>…</table>：整个表格以<table>标记开始、</table>标记结束。
2、<tbody>…</tbody>：如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构， tbody包含行的内容下载完优先显示，不必等待表格结束后在显示，同时如果表格很长，用tbody分段，可以一部分一部分地显示。（通俗理解table 可以按结构一块块的显示，不在等整个表格加载完后显示。）
3、<tr>…</tr>：表格的一行，所以有几对tr 表格就有几行。
4、<td>…</td>：表格的一个单元格，一行中包含几对<td>...</td>，说明一行中就有几列。
5、<th>…</th>：表格的头部的一个单元格，表格表头。
6、表格中列的个数，取决于一行中数据单元格的个数。
注：1、table表格在没有添加css样式之前，在浏览器中显示是没有表格线的
2、表头，也就是th标签中的文本默认为粗体并且居中显示
7.caption标签，为表格添加标题和摘要
摘要：<table summary="表格简介文本">
标题语法：
<table>
<caption>标题文本</caption>
<tr>
<td>…</td>
<td>…</td>
…
</tr>
…
</table>
13.使用<a>标签，链接到另一个页面
1.<a>标签可实现超链接语法：
<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>
2.title属性的作用，鼠标滑过链接文字时会显示这个属性的文本内容
3. 在新建浏览器窗口中打开链接 <a href="目标网址" target="_blank">click here!</a>
4.使用mailto在网页中链接Email地址 利用mailto做许多其它事情:
注意：如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。
5. <img>标签的使用：
14. 使用表单标签，与用户交互
1.网站怎样与用户进行交互？答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端
2.语法： <form method="传送方式" action="服务器文件">
3.表单讲解
4.文本输入框、密码输入框
5. 文本域，支持多行文本输入
6.单选框和复选框
1.两者的区别是单选框中的选项用户只能选择一项，而复选框中用户可以任意选择多项，甚至全选。
例子：
注意:同一组的单选按钮，name 取值一定要一致，比如上面例子为同一个名称“radioLove”，这样同一组的单选按钮才可以起到单选的作用。
7. 使用下拉列表框，节省空间
1.例子：
讲解：
1、value：
2、selected="selected"：
设置selected="selected"属性，则该选项就被默认选中。
8. 使用下拉列表框进行多选
1.在<select>标签中设置multiple="multiple"属性，就可以实现多选功能
例子：
9.使用提交按钮，提交数据
10.使用重置按钮，重置表单信息
1.比如用户输入“用户名”后，发现书写有误，可以使用重置按钮使输入框恢复到初始状态。只需要把type设置为"reset"就可以。
11.form表单中的label标签
2.CSS小记，
CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。
2.
3.CSS代码语法
4.CSS注释代码
5.内联式css样式
6.外部式css样式，写在单独的一个文件中
注：三种式的优先级：他们的优先级：内联式 > 嵌入式 > 外部式
其实总结来说，就是--就近原则（离被设置元素越近优先级别越高）。
7.什么是选择器？
8.类选择器
9.ID选择器
10.类和ID选择器的区别
11.子选择器
12.包含(后代)选择器
13.通用选择器
14.伪类选择符
15.分组选择符
16.继承
17.特殊性
18.层叠
19.重要性
20.文字排版--字体
21.文字排版--字号、颜色
22.文字排版--粗体
23.文字排版--斜体
24.文字排版--下划线
25.文字排版--删除线
26.段落排版--缩进
注意：2em的意思就是文字的2倍大小。
27.段落排版--行间距（行高）
28.段落排版--中文字间距、字母间距
29.段落排版--对齐
30.元素分类
1.在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。
31.元素分类--块级元素
32.元素分类--内联元素
33.元素分类--内联块状元素
34.盒模型--边框（一）
1.盒子模型的边框就是围绕着内容及补白的线，这条线你可以设置它的粗细、样式和颜色(边框三个属性)。
35.盒模型--边框（二）
36.盒模型--宽度和高度
37.盒模型--填充
38.盒模型--边界
39.css布局模型
在网页中，元素有三种布局模型：
1、流动模型（Flow）
2、浮动模型 (Float)
3、层模型（Layer）
1、流动模型（Flow）:
2.浮动模型
3.层模型
（1）层模型--绝对定位
(2)层模型--相对定位
(3)层模型--固定定位
40.Relative与Absolute组合使用
41.颜色值缩写
42.字体缩写
43.颜色值
配色表：
