一、HTML的相关内容
1.格式
<html>
<head> <meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
2. 内容
- HTML 标题是通过<h1> - <h6> 标签来定义的
- HTML 段落是通过标签 <p> 来定义的.
- HTML 图像是通过标签 <img> 来定义的，比如：<img src="/images/logo.png" />
- HTML 链接是通过标签 <a> 来定义的，比如：<a href="http://www.baidu.com">这是一个链接</a>
3.属性
class:为html元素定义一个或多个类名
id:定义元素的唯一id
style:规定元素的行内样式等
注意！！！
- class 属性可以多用 class=" " （引号里面可以填入多个class属性）
- id 属性只能单独设置 id=" "（只能填写一个，多个无效）
4.表格
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。
<td>：定义表格的列。
<border>设置边框。
<cellpadding>：设置内边距，<cellspacing>:设置单元格之间的间距。但用这两个就不能再设宽和高!
<th rowspan="2">电话</th> 这个是跨行
<th colspan="2">电话</th> 这个是跨列
<th rowspan="2" colspan="2">电话</th> 这个是跨行也跨列
5.表单（表单使用表单标签 <form> 来设置）
a.多数情况下被用到的表单标签是输入标签（<input>）。输入类型是由类型属性（type）定义的
b.密码字段通过标签<input type="password"> 来定义:
Password: <input type="password" name="pwd">
</form>
c.单选按钮
<input type="radio"> 标签定义了表单单选框选项
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
d.
复选框
<input type="checkbox"> 定义了复选框. 。
<form>
<input type="checkbox" name="" value="Bike">I have a bike<br>
<input type="checkbox" name="" value="Car">I have a car
</form>
slected="slected"是默认选中的意思
e.提交按钮
<input type="submit" value="Submit">（必须在form里提交）
<button>提交</button>
二、CSS相关内容
CSS语法规范：选择器{属性名1：属性值1；
属性名2：属性值2；
}
1、四种使用方式：
1）内部样式
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
2）外部样式
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
3）内联样式
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
4）外部导入样式
2、选择器
ID选择器用#表示
class用'.’表示
标签选择器：直接写标签名字
子代选择器：>
后代选择器：空格表示
3.行内元素不能设宽和高，如果要设，需要变成块级元素：display:block;
4.常见的一些属性
line-height:行间距
text-align:文字对齐方式
text-decoration:去掉下划线
font-family:字体属性
font-weight:字体加粗
font-size：字体大小
background-image:背景图片
background-reapeat：no-reapeat;背景图不平铺
border-radius:变圆角
background-position:背景图位置
list-style:ul li去掉小黑点
cursor:pointer;鼠标变小手
5.定位(口诀：子决父相)
relative 定位相对定位元素的定位是相对其正常位置。
absolute绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>
fixed 定位元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动：
6.伪类
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */