Day02-表格表单+面试题：link与import方法区别

表单

<form action="" method="" name=""></form>
	action=""提交的地址
	method=""提交方式
		method="get" 默认值,明文提交
		method="post" 密文提交
	name=""起个名字
1.文本框
	<input type="text" name="username" value="请输入您的用户名"/>
	name="username"起个名字
	value=""控件上的文本
2.密码框
	<input type="password" name="pwd"/>
	name="pwd"起个名字
3.提交按钮
	<input type="submit" value="发送"/>
	value="发送"改变按钮上的文本
4.重置按钮
	<input type="reset" value="清除"/>
	value="清除"改变按钮上的文本
5.普通按钮
	<input type="button" value="更换背景色"/>
	value=""改变按钮上的文本

表格

1.table-tr-td
<table border="1" width="600" height="400" cellspacing="0" cellpadding="20"></table>
2.table的属性：
	border="1" 边框1px
	width="600" 宽度
	height="400" 高度
	cellspacing="0" 外边距,单元格之间无间距
	cellpadding="20" 内边距,单元格上下左右都添加20px内边距
3.tr的属性
	height="60" 给这一行高度
	align="left左/right右/center居中" 该行内容水平对齐方式
4.td属性
	width="100" 宽度
	height="40" 高度
	align="left左/right右/center水平居中" 单元格内容水平对齐方式
	valign="top上/bottom下/middle垂直居中" 单元格内容的垂直对齐方式
***向右合并单元格,跨列合并单元格colspan="2"
***向下合并单元格,跨行合并单元格rowspan="2"

css引入方法

内部样式表

1.在head标签中引入
<style>
	选择器{
		属性1:值1;
		属性2:值2;
		...
	}
</style>
	宽度width:200px;
	高度height:200px;
	背景颜色background-color:red;
	字体颜色color:yellow;
2.例如
	<style type="text/css">
		div {
			width: 200px;
			height: 200px;
			background-color: red;
		}
		h2 {
			color: yellow;
		}
	</style>

外部样式表

1.在css文件夹中创建一个.css的文件
2.在head中使用<link rel="stylesheet" type="text/css" href="css/style.css"/>将外部css文件引入
	rel="stylesheet"关联样式表
3.在外部样式表中给元素添加样式
	@charset "utf-8";防止中文乱码
扩展：import方法引入外部样式表
	<style type="text/css">
		@import url("css/style.css");
	</style>
面试题：link与import方法区别是什么
差别1：本质的差别：link属于XHTML标签，而@import完全是CSS提供的一种方式。
差别2：加载顺序的差别：当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式（就是闪烁），网速慢的时候还挺明显。
差别3：兼容性的差别：@import是CSS2.1提出的，所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题。
差别4：使用dom(document object model文档对象模型 )控制样式时的差别：当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的

内联样式、行内样式

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

样式表特征

1.层叠性:浏览器处理样式冲突的能力,不重复的样式层叠在一起，重复的样式以后定义的为准(权值)
2.就近原则(和权值有关)

选择器、选择符

1.元素选择器
	a{超链接统一去掉下划线}
2.类选择器
	<div class="nav"></div>
	- 类名的命名规则：可以包含字母、数字、_、-,小写字母开头,见名知意
		类名的前面要加一个.nav{}
	- 元素多个类名<div class="box wrap"></div>,写在一个class中,空格隔开
	- 类名的特点：一个元素可以有多个类名，一个类名可以呗多次使用