或許你可能為求更美觀可能會使用圖片來插進頁面裡，但是，如果考慮到更精準的善用htm標籤，會發現htm內設標籤裡有一個名稱為「hr」的標籤。
hr為橫向水平線，作用即為分隔。
但是預設的hr總是不能滿足設計師，要如何讓它更精緻一點呢?
hr{ height:1px; border:none; border-bottom:#CCC 1px dashed;}
高度設定為1px;border的設定必須先將hr的border的預設值清空，再加上我們想要呈現的值。
2009年6月11日 星期四
2009年6月10日 星期三
區塊元素(block element)與內聯元素(inline element)元素
區塊元素(block element)與內聯元素(inline element)元素對於web製作是很重要的。
依據元素顯示(display)時的表現，可以看出，所有可見元素中，不是區塊元素的就是內聯元素。
可以這樣想像一下，區塊元素是一個大的框架，用於搭建大體結構，而內聯元素，就是用來組成細節和更具體的部分了。
開始web製作時，通常都會用塊元素先搭出一個架子，確定大框架的結構，然後往裡面添加內聯元素，作為細節的構造。
區塊元素和內聯元素的表現有什麼不同呢？ 嘗試寫一點代碼就可以看出來區別了
結果如下：
區別就可以看出來了。
區塊元素占了一整行，所以兩個區塊元素在一起時不會在同一行，而內聯元素就不一樣了，它們在同一行上依次排開，遇到邊界才會換行。
區塊元素：div、ul、ol、li、p、h
內聯元素：span、em、strong
使用上，div與span標籤都屬於無意義標籤，因此，在使用上必須要慎用。
依據元素顯示(display)時的表現，可以看出，所有可見元素中，不是區塊元素的就是內聯元素。
可以這樣想像一下，區塊元素是一個大的框架，用於搭建大體結構，而內聯元素，就是用來組成細節和更具體的部分了。
開始web製作時，通常都會用塊元素先搭出一個架子，確定大框架的結構，然後往裡面添加內聯元素，作為細節的構造。
區塊元素和內聯元素的表現有什麼不同呢？ 嘗試寫一點代碼就可以看出來區別了
<div>我是區塊元素div</div>
<div>我是區塊元素div</div>
<p>我是區塊元素p,
<span>我是內聯元素span</span>,
<span>我也是內聯元素span</span>,
<em>我是內聯元素em</em></p>
<div>我是區塊元素div</div>
<p>我是區塊元素p,
<span>我是內聯元素span</span>,
<span>我也是內聯元素span</span>,
<em>我是內聯元素em</em></p>
結果如下：
區別就可以看出來了。
區塊元素占了一整行，所以兩個區塊元素在一起時不會在同一行，而內聯元素就不一樣了，它們在同一行上依次排開，遇到邊界才會換行。
區塊元素：div、ul、ol、li、p、h
內聯元素：span、em、strong
使用上，div與span標籤都屬於無意義標籤，因此，在使用上必須要慎用。
CSS宣告
HTM中最上方的CSS宣告經常被人刪掉，弄出一些奇怪的錯誤:( 如果使用dreamweaver作為編輯器，新建一個檔，這個就自動加上了，但是純手寫代碼的時候很容易忘記。)
document type可以説明流覽器識別頁面是在哪一種標準下工作，是在html4.01，xhtml 1.0 traditional，或者xhtml1.0 strict....，每一種標準下，頁面的表現都會有一些差異，所以千萬不能丟（除非你僅僅是做一個很小的測試）。
記得加上：
document type可以説明流覽器識別頁面是在哪一種標準下工作，是在html4.01，xhtml 1.0 traditional，或者xhtml1.0 strict....，每一種標準下，頁面的表現都會有一些差異，所以千萬不能丟（除非你僅僅是做一個很小的測試）。
記得加上：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
訂閱：
文章 (Atom)