html 重点回顾（自学总结） 

基本的注意事项 -
    有益的提示 当您写 HTML 文本的时候，你永远也没法确定这些文本在另一台显示器上是如何显示的。一些人使用大显示器，而另一些使用小的。当用
户调整视窗的分辨率时，这些文本就会被重新格式化。所以不要通过在文本中添加空行和空格的办法在你的编辑器中格式化文本。
HTML 会裁掉文本中所有的空格。任何数量的空格都被按一个空格计数。另外，在 HTML 中，一个空行也被当作一个空格。
使用空的段落标记 <p> 去插入一个空行是个坏习惯。用 <br> 标签代替它！（但是不要用 <br> 标签去创建列表。不要着急，您将在稍后
的篇幅学习到 HTML 列表。）
您也许已经注意到了，在没有结束标签 </p> 的情况下，<p> 标签依然可以正常工作。不过不要这样做！下一个版本的 HTML 将不允许忽
略任何的结束标签。
HTML 会自动地在某些元素前后添加一个额外的空行，比如段落、标题元素前后。
使用水平线 (<hr> 标签) 来分隔文章中的小节是一个办法（但并不是唯一的办法）。
==================================
最常用的字符实体 
显示结果      描述        实体名称     实体编号  
                  空格       &nbsp;       &#160; 
     <          小于号       &lt;          &#60; 
     >         大于号       &gt;          &#62;
     &         和号          &amp;       &#38; 
     "           引号         &quot;        &#34; 
     '            撇号         &apos;     (IE不支持) &#39;
================================= 
锚标签
Target 属性 使用 Target 属性，你可以定义被链接的文档在何处显示。
下面的这行会在新窗口打开文档：
<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>
 ********
锚标签和 Name 属性 Name 属性用于创建被命名的锚（named anchors）。当使用命名锚（named anchors）时，我们可以创建直接跳至页面中某个节的链接，这
样使用者就无需不停的滚动页面来寻找他们需要的信息。
以下是命名锚的语法：
<a name="label">Text to be displayed</a>name 属性用于创建命名锚。锚的名称可以是任何你喜欢的名字。
下面这行定义了命名锚：
<a name="tips">Useful Tips Section</a>你会注意到，命名锚会以特殊的方式来显示。
将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个节，就像这样：
<a href="http://www.w3school.com.cn/html_links.asp#tips"> Jump to the Useful Tips Section </a>从文件 html_links.asp 内部链接到 Useful Tips 节的超级链接是这样的：
=================================
  框架
通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。
使用框架的坏处：
开发人员必须同时跟踪更多的HTML文档 很难打印整张页面 框架结构标签（<frameset>） 框架结构标签（<frameset>）定义如何将窗口分割为框架 每个 frameset 定义了一系列行或列 rows/columns 的值规定了每行或每列占据屏幕的面积 编者注：frameset 标签也被某些文章和书籍译为框架集。
框架标签（Frame） Frame 标签定义了放置在每个框架中的 HTML 文档。
在下面的这个例子中，我们设置了一个两列的框架集。第一列被设置为占据浏览器窗口的 25%。第二列被设置为占据浏览器窗口的 75%。
HTML 文档 "frame_a.htm" 被置于第一个列中，而 HTML 文档 "frame_b.htm" 被置于第二个列中：
<frameset cols="25%,75%">    <frame src="frame_a.htm">    <frame src="frame_b.htm"> </frameset>
基本的注意事项 - 有用的提示： 假如一个框架有可见边框，用户可以拖动边框来改变它的大小。为了避免这种情况发生，可以在 <frame> 标签中加入：
noresize="noresize"。
为不支持框架的浏览器添加 <noframes> 标签。
重要提示：不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用！不过，假如你添加包含一段文本的 <noframes> 标签
，就必须将这段文字嵌套于 <body></body> 标签内。（在下面的第一个实例中，可以查看它是如何实现的。）
===============================
基本的注意事项 - 有用的提示：
<thead> 定义表格的页眉。, <tbody> 定义表格的主体。 和 <tfoot> 定义表格的页脚；很少被用到，这是由于浏览器对它们的支持不太好。希望这种情况在未来版本的 XHTML 中会有所改观。
===============================
表格
<table border="1">     //表格边框
</table>
 ******
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td></td>
</tr>
</table>
注意：这个空的单元格的边框没有被显示出来。（不过 Mozilla Firefox 
可以将整个边框显示出来。）为了避免这种情况，在空单元格中添加一个空格占位符，就可以将边框显示出来。
*******
列表 ul/ol
1.无序列表
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
2.有序列表

同样，有序列表也是一列项目，列表项目使用数字进行标记。

3.自定义列表
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
输出：
Coffee
Black hot drink
Milk
White cold drink

========================================
HTML 表单 form 和 输入input

表单下的输入：文本域： 单行 <input type="text" name="firstname"> 多行：<textarea rows="10" cols="30">
单选按钮：<input type="radio" name="sex" value="male">
复选按钮：<input type="checkbox" name="bike">
表单的动作属性（Action） <form name="input" action="html_form_action.asp" method="get"> </form> 确认按钮： <input type="submit" value="Submit">

========================================
图片 img

　　提示：如果你打算使用背景图片，你需要紧记一下几点：

　　背景图像是否增加了页面的加载时间。小贴士：图像文件不应超过 10k。

     背景图像是否与页面中的其他图象搭配良好。

     背景图像是否与页面中的文字颜色搭配良好。

     图像在页面中平铺后，看上去还可以吗？

     对文字的注意力被背景图像喧宾夺主了吗？

 

==============================

HTML 样式

外部样式表
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head> 

内部样式表
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。 

 <head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>

内联样式 当特殊的样式需要应用到个别元素时，就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。

<p style="color: red; margin-left: 20px">
This is a paragraph
</p>

 ======================

针对搜索引擎的关键字
某些万维网搜索引擎使用 meta 标签的 name 和 content 属性来索引页面。

然而，由于非常多的网管们使用 meta 标签制造垃圾信息，比方说在页面重复关键词以达到提高排名的目的，一些搜索引擎已经彻底放弃了使用它们。

======================

URL（统一资源定位器）

一个称为 URL（统一资源定位器）的东西用于对万维网上的文档（或其他数据）进行寻址。一个完整的网址，例如：http://www.w3school.com.cn/html/lastpage.html

使用 FTP 进行下载 以下 HTML 代码创建一个下载文件的链接：

<a href="ftp://www.w3school.com.cn/ftp/winzip.exe">Download WinZip</a>

链接到邮件系统

以下 HTML 代码创建一个指向您的邮件系统的链接：

<a href="mailto:someone@w3school.com.cn">someone@w3school.com.cn</a>

 

 

posted @ 2013-05-08 15:50  东泉  阅读(184)  评论(0)    收藏  举报