css后续

review--------

列表：
ul:
无序列表
li
ol:
有序列表
li
dl：
标题列表
dt：标题
dd：列表项
form：
表单
与服务器端进行数据交互时使用的标签

私有属性：
	action:设置表单提交的地址
	method：表单提交的方式
		delete
		put
		...

		get:默认
		post:
	target:
	enctype:设置表单的编码
子组件：
	input：
		**type:
			text
			password
			submit
			reset
			button
			image
				src
				alt
				width
				height
			file
			radio
			checkbox
			hidden:

			color
			url
			email
			week
			date
			...

		value
		name
		size:
		maxlength:
		checked:
		disabled:
		readonly:
		plachloder:
		pattern:
		min/max
		step:
		form
		formaction
		formmethod
		...

		input form='one'
		form id='one'
		form id='two'
		form id
	label
	fieldset
	button
	select
	textarea

	progress
	meter
	。。。

---

css:
html:建房子
css：装修

1.什么是css？
cascading style sheet
层叠 样式 表

css不能脱离html而单独存在

2.语法
1.属性的设置
属性名和属性值之间使用冒号分割
多对属性之间使用分号分割
最后一对属性可以不加分号

	1.style
		<div style="width:100px;height:100px;background-color:red"></div>

	2.其他
		代码块
		选择器{
			width:100px;
			height:100px;
			background-color:red;
		}

2.注释
	1.写法
		/*注释内容*/
	2.作用

	3.注意
		注释不能嵌套使用
		<!--outer
			<!--inner-->
		-->
		/*
			outer
			/*inner*/
		*/

3.速记写法
	简写形式

	top
	bottom
	left
	right

	padding-top:10px
	padding-left:10px
	padding-right:10px
	padding-bottom:10px

	padding:10px;//上下左右均为10px
	padding:10px 20px;//上下10px 左右20px
	padding:10px 20px 30px;//上10px 左右20px 下30px
	padding:10px 20px 30px 40px;
		//上 右 下 左

	margin-top
	margin-left
	margin-right
	margin-bottom

	margin:padding;
	margin:0 auto;//设置给具有宽度的块级元素时，元素可以在父元素中自动居中

	broder:1px solid red;
		border-width:
		border-style:
		border-color:
			border-top-width
			border-top-style
			border-top-color:

3.css作用到html上？
1.行内样式
写在标签内部的style属性上
2.内嵌式/内部样式表
在head内部使用style标签设置
3.外部样式表(建议使用)
当前html文件外部，创建一个css文件
.css为文件后缀名
1》link标签
建议使用link标签
优先加载html
2〉@import属性
优先加载css

优先级：
	行内样式>内嵌式=外部引入

	结论：
		就近原则：哪一个样式距离html元素更近，睡的优先级更高

4.选择器
标签选择器：
通过标签名称选择一类元素
div{}
span{}
p{}
id选择器：
通过id属性选择一个元素
#one:id=one
类选择器：
class:通过class属性选择一类元素
.one:class=‘one’
普遍选择器：
*
选择所有
后代选择器：
空格:选择所有后代元素
>：选择直接子元素
兄弟选择器：
+：
选择当前元素之后的一个兄弟元素
～：
选择当前元素之后的所有兄弟元素
组合选择器：
div #one .one
div#one
div.one
多选择器：
div,p,span,#one,.one{

	}
属性选择器：
	根据元素的属性选择一类元素
	[id]:具有id属性的
	[id='one']:具有id属性，属性值为one的
	[class~='one']:具有class属性，并且属性值之一为one的元素
	[class^='o']:具有class属性，并且属性值以o开头
	[class$='o']:具有class属性，并且属性值以o结尾
	[class*='o']:具有class属性，并且属性值中包含o字符的
伪类选择器：
	div class="one"
	.one

	:伪类名称
	:first-child
	:last-child
	:nth-child(num/odd/even)

	:first-of-type:
	:last-of-type:

	a:
		:link:未点击状态
		:hover:悬停状态
		:active：鼠标按下状态
		:visited:点击之后的状态

	link->visited->hover->active


伪元素选择器：
	::伪元素名称

	::first-letter
	::first-line
	::before
		content:''/url()
	::after
	::selection