web学习第二周

1.嵌套标签

1.列表之间可以互相形成多层级列表。
2.练习

2，表格标签

1.<table>：表格的最外层容器
2.< tr>:定义表格行
3.< th>:定义表头
4.:定义表格单元
5.< captio>:定义表格标题
*注意：之前是有嵌套关系的，要符合嵌套规范。

3,表格的属性

1.border:表格边框
2.cellpadding：单元格之间的空间
3.cellspacing:单元格之间的空间
4rowspan:合并行
5.colspan:合并列
6.align：左右对齐方式
7.valign：上下对齐方式

4，表单标签

< form>:表单的最外层容器
< imput>:标签用于搜索用户信息，根据不同的type属性值，展示不同的控件，如输入框、密码框、复选框、等。

5.表单相关标签

< textarea>:多文本框
checked, disabled,name,

6. 表格表单组合实例

目标

7.< div>与< span>

div：做一个区域划分的块
span：对文字进行修饰的内联

8.css基础语法

格式：选择器{属性一：值一；属性二：值二}
单位;px;像素（pixel）、%（百分比当前容器的百分之多少*****）
基本样式：width，height，background-color

css快捷键：shift+ait+a
注释快捷键：ctrl+/

9.内联样式和内部样式

1.内联样式：style属性(在body当中)
2.内部样式;style标签(在head当中)
区别：内部样式的代码可以复用，符合w3c的标准规范

10.外部样式以及两种学法

1：< ling>标签引入外部资源，< rel>属性指的是资源跟页面的关系，
< href>:属性资源的地址。
2：通过@import方式引入外部样式。(一般不使用）在head上

练习：

10css颜色表示法

1.单词表示法
2.十六进制表示法0123456789abcdef.-----------#000000
3.rgb三原色表示法：红-绿-蓝-格式：rgb(255,255,255);
取值范围：(0~255)
4：提取颜色: ps(复制）

11，背景样式

1.background-color：背景颜色
2.background-image：背景图片（url）背景地址
3.background-repeat：背景图片的平铺方式
repeat-x
repeat-x
repeat(默认值)
no-repeat(都不平铺）
4.background-position：背景颜色的位置
：x --y：number
单词x;left,center,right
y：top，center，bottom
5.background-attachment：背景图随滚动条的移动方式
scroll：默认值（背景位置是按照当前元素进行偏移的）
fixed:固定值（背景位置是按照浏览器进行偏移的）
附加;添加滚动条！！！
注意：当设置成固定式应改变图片比例
例子！！！！！！！！

12.背景实现视觉差效果

注释：fixed效果
以及可以在body中可以添加表格之类

13.边框样式

1.border-style边框的样式
solid：实线
dashed：虚线
dotted：点线
2.border-width:边框的大小
px…
3.border-color：边框的颜色(只针对某一条边进行单独设置)
red——#0000…

边框也可以针对某一条边进行单独设置：border-left-style(中间是方向）

14.边框实现三角形

1.颜色：透明颜色（transparent）
2.在body也可以调颜色

15.css文字样式

font-family:文字类型
中文:(也可以用英文）
英文;
衬线体（有棱角)和非衬线体
1.多个字体类型设置的目的
2.引号的添加的目的

16.字体大小粗细样式

1**.font-size(文字大小**）默认大小16px
2.写法;number(px)

3.font-weight：字体粗(bold）细
写法：也可以加数值(100–900）
4.font-style：字体样式
1.模式：正常（normal) -----斜体（italic）（oblique）范围大
2.写法：单词

17 文本修饰和文本大小

（1）text-decoration:文本修饰
下划线under-line
删除线-line-through
上划线over-line
不添加任何修饰;none
注意;添加多个文本修饰要加空格
（2）text-transform：文本大小(针对英文）
小写;lowercase
大写**;uppercase**
只让首字母大写;capitalize

18css段落样式

1.taxt-indent：首行缩进单位
em单位：相对单位，lem永远和字体大小一样
2.twxt-alihn：文本对齐方式
对齐方式：left——right——center——justify（两端点对齐）

19.文本的行高

line-height:定义行高(一行文字的高度，上边距和下边距的等价关系
默认行高不是固定值，根据字体不断的变化
取值;1.number（px）——2.sale(比例值—跟文字大小成比例）

20.文本间距和英文折行

letter-spacing：定义子=字间距
word-spacing：英文间距
强制折行;(针对英文）
1.word-break：break-all（非常强烈)
2.word-wrap：break-word（比较强烈）会产生空白区域

21.文本与段落实现个人简介

练习
参考

22.css的复合样式

1.CSS 复合样式：
复合的写法，是通过空格的方式实现的。复合写法有的是不需要关心顺序，例如 background 、 border ；有的是需要关心顺序，例如 font .
1.background: red url () repeat 00;2. border :1px red solid ;
3。 font :
注：最少要有两个值 size family
weight style size family

23.id选择器

,CSS 选择器
id =" elem "
注：

1. ID 是唯一值，在一个页面中只能出现一次，出现多次是不符合规范的。2．命名的规范，由字母、下划线、中划线、字母（并且第一个不能是数字）
   3．驼峰写法： searchButton （小驼峰） SearchButton （大驼峰）
   短线写法： search - small - button
   下划线写法： search -small_ button

24.class选择器及注意事项

css：.elem{}
html：class=“elem”

注意事项;1.class选择器是可以复用的。
2.可以添加多个class样式。
3.多个样式的时候，样式的优先级根据css决定，而不是class属性中的顺序.
4.标签+类的写法