HTML学习笔记

一：HTML标签

1.HTML标题：<h1>-<h6>，由大到小

2.段落：<p></p>

3.链接：<a href="#"></a>，href属性指定链接的地址

4.图像：<img src="#" />，src属性指定图片的来源

5.折行：<br />

6.水平线：<hr />

7.预格式：<pre></pre> 使用这个标签，换行和空格会保留

8.文本格式化有关标签:

   <b></b> 黑体；<strong></strong> 定义加粗，也是黑体；

   <em></em> 定义着重字体，其实就是斜体；<i></i> italic斜体；

   <small></small> 小号字；<big></big> 大号字；

    supscript上标，定义上标字； subscript下标，定义下标字；

9.列表标签

   <ul></ul>定义无序列表（unorder list）

   <ol></ol>定义有序列表

   <li></li>定义列表项（list）

   <dl></dl>自定义列表（definition list）<dt></dt>定义列表项（definition item） <dd></dd>定义描述（definition description）

10.表格标签

   <table></table>定义一个表格，表格的border属性可以定义边框

   <tr></tr>定义行，<th></th>定义表头，<td></td>定义单元格

11.框架标签

   <frameset></frameset>定义框架集

  <frame></frame>定义框架，框架可以用来显示其他页面

12.表单标签

<form></form>定义一个表单

<form action="http://www.example.com/test.asp" method="post/get">

<input type="text" name="lastname" value="Nixon" size="30" maxlength="50">

<input type="password">

<input type="checkbox" checked="checked">

<input type="radio" checked="checked">

<input type="submit">

<input type="reset">

<input type="hidden">

<select>

   <option>Apples

   <option selected>Bananas

   <option>Cherries

</select>

<textarea name="Comment" rows="60" cols="20"></textarea>

</form>

二：使用时应该要注意的问题

1.如果不使用预格式标签<pre></pre>的话，所有的空格和换行浏览器只保留一个空格

2.<h1>-<h6>只用做标题，因为浏览器会根据标题生成索引，不要为了产生粗体的效果而使用

3.使用<br /><hr />标签最好加上"/"

4.页面布局最好不要用table，<table> 元素的作用是显示表格化的数据

三：块级元素和行内元素

块级元素：块级大多为结构性标记

  <address>...</adderss>   

  <center>...</center>  地址文字

  <h1>...</h1>  标题一级

  <h2>...</h2>  标题二级

  <h3>...</h3>  标题三级

  <h4>...</h4>  标题四级

  <h5>...</h5>  标题五级

  <h6>...</h6>  标题六级

  <hr>  水平分割线

  <p>...</p>  段落

  <pre>...</pre>  预格式化

  <blockquote>...</blockquote>  段落缩进   前后5个字符

  <marquee>...</marquee>  滚动文本

  <ul>...</ul>  无序列表

  <ol>...</ol>  有序列表

  <dl>...</dl>  定义列表

  <table>...</table>  表格

  <form>...</form>  表单

  <div>...</div>

行内元素：行内大多为描述性标记

  <span>...</span>

  <a>...</a>  链接

  <br>  换行

  <b>...</b>  加粗

  <strong>...</strong>  加粗

  <img >  图片

  ^...  上标

  _...  下标

  <i>...</i>  斜体

  <em>...</em>  斜体

  <del>...</del>  删除线

  <u>...</u>  下划线

  <input>...</input>  文本框

  <textarea>...</textarea>  多行文本

  <select>...</select>  下拉列表

·块级元素

  1.总是从新的一行开始

  2.高度、宽度都是可控的

  3.宽度没有设置时，默认为100%

  4.块级元素中可以包含块级元素和行内元素

  5.都有align属性

  6.dispay都是block

·行内元素

  1.和其他元素都在一行

  2.高度、宽度以及内边距都是不可控的

  3.宽高就是内容的高度，不可以改变

  4.行内元素只能行内元素，不能包含块级元素

  5.没有align属性

  6.display都是inline