html 标签

<hn></hn> 共有6类，从h1到h6，用作设置文本标题

<p></p>段落标签，用于设置文本的段落

<span></span>没有语义，只是为了设置单独文本的样式。

//////////////////////////////////////////////////////////////

<strong></strong>强调字体，加粗

<q></q>短文本引用，如：引用了别人的名言等。默认添加双引号

<blockquote></blockquote>长文本引用，引用较长的话。默认添加双引号

html中不识别回车和空格，所以要实现回车和空格，用标签

<br/>分行显示，即回车

 空格

<hr/>添加水平横线，分割用，默认灰色，有点粗

<address></address>地址标签，为网页添加地址信息，默认斜体

<code></code>在文本中插入一行代码

<pre></pre>用于在文本中插入多段代码

///////////////////////////////////////////////////////////

<ul>
<li>精彩少年</li>
<li>美丽突然出现</li>
<li>触动心灵的旋律</li>
</ul> 用于显示信息列表，默认li标签前面会带个小点。

<ol>
   <li>前端开发面试心法 </li>
   <li>零基础学习html</li>
   <li>JavaScript全攻略</li>
</ol>                                           用于有顺序的显示信息列表，默认li标签前面会带个数字顺序，默认从1开始。

<div></div>把逻辑独立的区域划分出来

id=""为div命名，唯一的

////////////////////////////////////////////////////////////////

创建表格的四个元素：

table、tbody、tr、th、td

1、<table>…</table>：整个表格以<table>标记开始、</table>标记结束。

2、<tbody>…</tbody>：当表格内容非常多时，表格会下载一点显示一点，但如果加上<tbody>标签后，这个表格就要等表格内容全部下载完才会显示。

3、<tr>…</tr>：表格的一行，所以有几对tr 表格就有几行。

4、<td>…</td>：表格的一个单元格，一行中包含几对<td>...</td>，说明一行中就有几列。

5、<th>…</th>：表格的头部的一个单元格，表格表头。

6、表格中列的个数，取决于一行中数据单元格的个数。

7、复杂表格

　　(1)rowspan 属性规定单元格可横跨的行数;

　　(2)colspan 属性规定单元格可横跨的列数

默认：

1、table表格在没有添加css样式之前，在浏览器中显示是没有表格线的

2、表头，也就是th标签中的文本默认为粗体并且居中显示

<table summary="表格简介文本" > <caption>2012年到2013年库存记录</caption> 为表格添加摘要和标题，不会显示在页面中，主要用于搜索引擎抓取

/////////////////////////////////////////////////////////////////////////

<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a> title 用于语义化，便于搜索引擎抓取

<a href="目标网址" target="_blank">click here!</a> 链接默认在当前窗口打开，设置target，在新的窗口打开

mailto 属性发送电子邮件：

如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本"> 为网页插入图片

例如：

<form    method="post"   action="save.php">
           <label for="username">用户名:</label>
         <input type="text" name="username" />
       <label for="pass">密码:</label>
           <input type="password" name="pass" />
</form>                                                            所有表单控件（文本框、文本域、按钮、单选框、复选框等）都必须放在<form></form>标签之间（否则用户输入的信息提交不到服务器上）。

文本输入框、密码输入框

1、type：

当type="text"时，输入框为文本输入框;

当type="password"时, 输入框为密码输入框。

当type="submit"时, 为提交按键。

当type="reset"时, 为重置按键。

2、name：为文本框命名，以备后台程序ASP 、PHP使用。

3、value：为文本输入框设置默认值。(一般起到提示作用)

举例：

<form>
  姓名：
  <input type="text" name="myName">
  <br/>
  密码：
  <input type="password" name="pass">
</form>

<textarea  rows="行数" cols="列数">文本</textarea> 当用户需要在表单中输入大段文字时，需要用到文本输入域

form表单中的label标签

小伙伴们，你们在前面学习表单各种控件的时候，有没有发现一个标签--label，这一小节就来揭晓它的作用。

label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该 label标签相关连的表单控件上）。

语法：

<label for="控件id名称">

注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。

例子：

<form>
  <label for="male">男</label>
  <input type="radio" name="sex" id="male" />
  <br />
  <label for="female">女</label>
  <input type="radio" name="sex" id="female" />
  <label for="email">输入你的邮箱地址</label>
  <input type="email" id="email" placeholder="Enter email">
</form>

css总结：>作用于元素的第一代后代，空格作用于元素的所有后代。

常用的块状元素有：

常用的内联元素有：

常用的内联块状元素有：

//////////////////////////////////////////////////////////////////////////

文字排版

letter-spacing 字母间距

word-spacing 字间距

text-align:center; 居中（图片、字）

line-height:1.5em; 1.5倍的行高

text-indent:2em; 首行缩进2个字符

text-decoration:line-through; 文字删除线。用于把原价划掉

text-decoration:underline 下划线

font-style:italic; 斜体

font-weight:bold；粗体

///////////////////////////////////////////////////////////////////////////////////

层模型有三种形式：

1、绝对定位(position: absolute)

2、相对定位(position: relative)

3、固定定位(position: fixed)