笔记：
相对路径：1）同一级直接写文件名 2）/下一级文件名 3) ../上一级文件名(注意是两个点)
相对路径用 / 绝对路径用 \
<a>标签用于定义超链接，作用是从一个页面链接到另一个·页面
链接的语法格式
<a href="跳转目标" target="目标窗口的弹出方式"> 文本、图像、表格、音频、视频等 </a>
链接方式：
1.外部链接
举例：<a href="http://www.qq.com" target="_self"> 腾讯 </a>
(注意href里必须用http://开头 , target 打开窗口方式 默认为_self表示在此窗口打开，
用_blank表示在新窗口打开超链接)
2.内部链接（不需要加http://)
目录文件夹里的页面相互跳转
3.空链接 #
<a href="#"> 文本或图像 </a>
4.下载链接：如果href里面地址是一个文件或者压缩包，会下载这个文件。
（地址链接的是 文件 .exe 或者是 zip 等压缩包形式 常见为压缩包形式）
5.锚点链接：点击链接，可以快速定位到页面中的某个位置
·在链接文本的href属性中，设置属性值为#名字的形式，如<a href="#two">第二集</a>
·找到目标位置标签，里面添加一个id属性 = 刚才的名字，如：<h3 id="two">第二集介绍</h3>
注释标签
<!--注释语句--> 快捷键： ctrl + /
特殊字符
空格
< <
> >
表格标签：展示数据更为方便
<table>
<tr>
<td>单元格内的文字或者图片或者链接</td>
...（<th>这是表头单元格，居中加粗显示</th>）
</tr>
....
</table>
表格属性（一般用css来设置）
align 对齐
cellpadding 文字与单元格的距离 默认为1像素
cellspacing 单元格间的距离 默认为2像素
width 宽 height高
表格结构标签
<thead>标签 表格的头部区域
<tbody>标签 表格的主体区域
合并单元格
1.合并单元格方式
跨行合并：rowspan="合并单元格的个数"
跨列合并：colspan="合并单元格的个数"
目标单元格：（写合并代码）
跨行：最上侧单元格为目标单元格，写合并代码
跨列：最左侧单元格为目标单元格，写合并代码
最后删除多余的单元格）
列表标签：用来布局更为方便
无序列表:
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
.....
</ul>
在<ul>标签里只能放<li>标签，其他标签或者文字
是不被允许的，<li>里可以随便放
有序列表
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
.....
</ol>
自定义列表
<dl>
<dt>名词</dt>
<dd>名词解释1<dd>
<dd>名词解释2<dd>
..........
</dl>
在<dl>标签里只能放<dt>和<dd>标签，
其他标签或者文字是不被允许的
表单
1.表单域
<form>
</form>
2.表单控件(表单元素）
1. input 输入表单元素
<input type="属性值" />
(单标签)
radio 单选框
checkbox 复选框
·name 和 value是每个表单元素都有的属性值，
主要给后台人员使用
·name表单元素的名字，
要求单选按钮和复选框要有相同的name值
单选按钮和复选框可以设置checked 属性，
当页面打开的时候就可以默认选中这个按钮
单选框只能有一个，复选框可以有多个
maxlength属性 表示输入的最多字符，一般较少使用
2. select 下拉表单元素
语法：
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
.......
</select>
3. textarea 文本域元素（多行文本的输入）
语法：
<textarea rows="显示的行数" cols="列字符数">
文本内容
</textarea>
3.提示信息
css（美化网页，布局页面)
css语法规范
选择器+一条或多条说明
font-size:数字px;(字体大小)
css代码风格（规范）：
1.样式格式书写
推荐使用展开式风格，比较直观
h3 {
color:pink;
font-size: 20px;
}
2.样式大小写
一般用小写
3.空格规范
· 属性值前面，冒号后面，保留一个空格
·选择器（标签）和大括号中间保留空格
选择器：
基础选择器 和 复合选择器
1.基础选择器
由单个选择器组成
包括 标签选择器 类选择器 id选择器 通配符选择器
·类选择器
语法：
·类名 {
属性1： 属性值1；
......
}
（不要用纯数字，中文等命名，一般用小写字母命名）
用class调用 格式为class="类名"
（样式点定义，结构类（class）调用,开发最常用）
·id选择器
语法
#名字 {
属性1： 属性值1；
......
}
用id调用
（id选择器只能调用一次）
·通配符选择器(改全部标签）
* {
属性1： 属性值1；
.......
}
字体属性：
例如：
h2 {
font-family:'微软雅黑'；（文字系列，但是更提倡用英语写）
font-size: 20px;(文字大小，不同浏览器可能默认显示的字号大小不一样
，我们尽量给一个明确值大小，不要默认大小）
*font-weight: normal(正常的字体）（400） ；
（等价于font-weight:700；实际开发更提倡使用数字进行加粗或变细，注意不加单位）
bold 加粗
bolder 特粗体
light 细体
*
*font-style: nomal;文字样式
italic 倾斜
*
}
可以同时用多种字体比如font-family:Arial,'Microsoft Yahei';
一般情况下，如果有空格隔开的
多个单词组成的字体，加引号
可以给body指定整个页面文字的大小，标题标签比较特殊，需要单独
指定文字的大小
字体复合写法：
格式： font: font-style font-weight font-size/line-height font-family;
例如： font：italic 700 16px 'Microsoft yahei';
(顺序不能颠倒)
不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性
，否则font属性将不起作用
*css文本属性
定义文本的外观，比如颜色、对齐文本、装饰文本、文本缩进、行间距等
1.文本颜色
表示 属性值
预定义的颜色值 red,green,blue 等
16进制 (常用) #FF0000,#FF6600,#29D794
RGB代码 rgb(255,0,0)或rgb(100%,0%,0%)
2.对齐文本
text-align 属性用于设置元素内文本内容的水平对齐方式
left:左对齐
right:右对齐
center:居中对齐
3.装饰文本
text-decoration
属性值 描述
none 默认。没有装饰线（最常用，可用于取消链接自带的下划线）
underline 下划线。链接a自带下划线（常用）
overline 上划线。（几乎不用）
line-through 删除线。（不常用）
4.文本缩进
text-indent 属性用来指定文本的第一行缩进，
通常是将段落的首行缩进。
格式： text-indent: 20px(取负值的时候往左缩进);
text-indent: 2em; em是一个相对单位，就是当前元素1个文字
的大小，如果当前元素没有设置大小，则会按照父元素的1个文字的大小
*line-height属性用于设置行间的距离。可以控制文字行与行之间的距离
行间距包括上间距、文本高度、下间距。
*样式表
外部样式表
引用外部样式表分为两步
1.新建一个后缀名为.css的样式文件，
把所有css代码都放入此文件中。
2.在HTML页面中，使用<link>标签引入这个文件
<link rel="stylesheet" herf="css文件路径">
*css复合选择器（基础选择器的组合）
复合选择器包括后代选择器（又称包含选择器，重要）、子选择器、并集选择器、伪类选择器
1.后代选择器
元素1 元素2 { 样式声明 }
元素1是父级，元素2是子级，最终选择的是元素2
元素2可以是儿子，也可以是孙子，只要是元素1的后代即可
2.子选择器，只能选择作为某元素的最近一级子元素。
简单理解就是选亲儿子元素
格式： 元素1>元素2 { 样式声明 }
3.并集选择器
并集选择器可以选择多组标签，同时为他们定义相同的样式。
通常用于集体声明。
格式： 例如： 元素1，元素2 { 样式声明 }
上述语法表示选择元素1和元素2.
心得体会：通过一周的前端的学习，初步掌握一些写网页结构并美化网页的方法，感觉不难学，就是繁琐复杂。。
2222
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
