CH1 认识HTML
- HTML和CSS是我们用来创建网页的语言：
HTML是超文本标记语言（HyperText Markup Language）的缩写，用来建立网页的结构；
CSS是层叠样式表（Cascading Style Sheet）的缩写，用来控制HTML的表现。 - Web服务器存储并提供由HTML和CSS创建的网页。浏览器获取页面，并根据HTML和CSS显示网页的内容。
- 所有页面都要有一个<html>元素，其中要有一个<head>元素和一个<body>元素：
网页的信息放在<head>元素里；<body>元素里的内容就是你将在浏览器里看到的东西。 - 可以在<style>元素中写CSS规则，为HTML网页增加CSS。<style>元素总要放在<head>元素里。
可以在<style>中添加type属性；可以使用CSS在HTML中指定元素的特性。
1 <style type="text/css"> 2 body{ 3 background-color:#d2b48c; 4 margin-left:20%; 5 margin-right:20%; 6 border:2px dotted black; 7 padding:10px 10px 10px 10px; 8 font-family:sans-serif; 9 } 10 </style>
CH2 深入了解超文本
- 相对路径是相对于链接的源Web页面指向网站中其他文件的一个链接。
使用“..”可以链接到源文件上一层文件夹中的一个文件。
1 <a href ="../../../beverages/elixir.html" > 2 elixir 3 </a>
- 为网站选择的文件名和文件夹名中不要使用空格！
- ★★★☆☆最好在构建网站初期组织网站文件，这样就不用在网站升级时修改一大堆的路径了:)
CH3 构建模块
- 开始输入内容之前要规划好Web页面的结构。规划页面时，首先设计大的块（block）元素，然后用内联（inline）元素完善。
！记住！要尽可能使用元素来高速浏览器你的内容的含义。一定要使用与内容含义最接近的元素。 - 块（block）元素与内联（inline）元素：块元素通常用作Web页面中的主要构建模块，而内联元素往往用来标记小段内容。
！<a>既可以是内联元素，也可以是块元素；<br>是块元素和内联元素之间的一个模糊地段。 - 要对HTML内容中的特殊字符使用字符实体。较常用的特殊字符主要有：
“<”字符的缩写为“<”（lt，less-than）；
“>”字符的缩写为“>”（gt，greater-than）；
“&”字符的缩写为“&”（amp，ampersand）；
……
（实体名与实体编号等价，更多实体清单可在w3school网站上搜索） - <q>元素与<blockquote>元素：<q>元素是内联元素，用于短引用；<blockquote>元素是块元素，用于长引用。
- HTML列表构建。
1 <!--有序列表 2 ol = ordered list 3 li = list item --> 4 <ol> 5 <li>Walla Walla, WA</li> 6 <li>Magic City, ID</li> 7 <li>Bountiful, UT</li> 8 <li>Last Chance, CO</li> 9 <li>Truth or Consequences, NM</li> 10 <li>Why, AZ</li> 11 </ol> 12 13 <!--无序列表 14 ul = unordered list 15 li = list item --> 16 <ul> 17 <li>cellphone</li> 18 <li>iPod</li> 19 <li>digital camera</li> 20 <li>and a protein bar</li> 21 </ul> 22 23 <!--自定义列表 24 dl = defined list 25 dt = defined title 26 dd = defined data --> 27 <dl> 28 <dt>BSS</dt> 29 <dd>road signs common in the ...</dd> 30 <dt>2df</dt> 31 <dd>Ðετröìτ</dd> 32 </dl>
- 本章提及的其他元素：
<code>元素：显示计算机程序代码；
<em>元素：标记想用不同方式展示的文本；
<time>元素：告诉浏览器这个内容是一个日期或时间，或者同事包含日期和时间；
<strong>元素：标记你希望特别强调的文本；
<pre>元素：希望浏览器按你输入的方式原样显示文本时；
……
CH4 连接起来
- ！！！域名≠网站名！！！
域名（domain）是一个唯一的名字，用来唯一标识网站。
例如，“www.headfirst.com”是一个网站名，其中“headfirst.com”是域名，“www”是域中的一个特定服务器的名字。
so，还可以创建使用相同域名的其他网站，比如“corporate.headfirst.com”、“book.headfirst.com”、“OReilly.headfirst.com”等。 - FTP（文件传输协议，File transfer protocol）是向服务器传输web页面和内容的常用方法。
- URL（Uniform Resource Locators，统一资源定位符）【或web地址】，可以用来标识web上的任何资源。
典型的URL由一个协议、一个网站名和资源的一个绝对地址组成。
- 协议：通常包括HTTP协议、file协议、FTP协议、mail协议等。
HTTP（HyperText Transfer Protocol，超文本传输协议）是一个请求和响应协议，用来在web服务器和浏览器之间传送web页面；
浏览器使用file协议从本地计算机读取页面。！file协议的URL有3个斜线：file:///document/index.html（可以理解为，如果删去一个HTTP URL中的网站名，那么也会有3个斜线。） - 绝对路径是从根文件夹到一个文件的路径。根文件夹通常用网站名后的第一个“/”表示。
如果指定一个目录而没有没有制定文件名，则web服务器会查找一个默认页面（index.html或default.htm）返回到浏览器。
总的说来，利用URL，可以请求浏览器从Web获取一个页面（或者其他类型的资源）。协议部分告诉浏览器应当使用什么方法来获取资源；网站部分（由服务器名和域名组成）告诉浏览器要从互联网上的哪个计算机获取资源。最后绝对路径会告诉服务器我们要找哪个页面。 - 协议：通常包括HTTP协议、file协议、FTP协议、mail协议等。
- 绝对路径与相对路径：相对路径只用来链接同一网站内的页面，而URL通常用来链接其他网站。
- 关于<a>元素的一些属性：
id：可以用id属性在页面中创建一个目标，使用#后面加一个目标id，可以链接到页面中的那个位置；
target：使用target属性在另一个浏览器窗口中打开链接。but！对于使用各种不同设备和浏览器的用户，target属性可能会有问题，要适当使用，不要过度使用。
View Code1 Read the<a href="http://wickedlysmart.com/buzz/index.html#Coffee" 2 title="阅读buzz网站" target="_blank">Caffeine Buzz</a>
tips：
1.保证链接标签很简洁。不要把整个句子或大段文字放在链接里。一般来讲，要保证只有几个单词。可以在title属性中提供额外的信息对链接进行描述（通常建议title属性值与所链接的web页面的<title>元素值相同）。
2.保证链接标签是有意义的。不要使用类似“单击这里”或“这一页”之类的链接标签。用户往往会首先粗略扫一眼页面，看看有没有链接，然后才会通读页面。所以，通过提供有意义的链接，可以改善页面的可用性。测试方法：只读页面上的链接，能理解吗？是否需要读链接周围的文字。
3.不要把链接放在一起，用户将很难区分放在一起的链接。
1070
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
