<
close
老是想仰賴網路上的大大們似乎是不行的。
因為整理的連結已經有失連的了.....才驚覺不自己發奮用功整理不可了囧
css hank:
- 區分IE6，IE7，firefox
只能辨別*，不能辨別 ，支援_
能辨別*，能辨別 !important，支援_
不能辨別*，能辨別 !important，不支援_
所以寫法為firefox，IE7，IE6(順序都是firefox的寫在最前面，IE7的在中間，IE6的在最後面)|* _(下底線) !important IE6 o o x IE7 o x o firefox x x o
background:orange; *background:green; _background:blue; - IE下浮動元素雙倍邊距時的解決辦法
將浮動元素後再加設display屬性設為inline。
div1 {
float:left; display:inline; margin-left:20px;
} - 列表加上浮動在各瀏覽器中的解決
CSS總是出人意表，而IE卻總是讓人意外。
IE下的留白是由margin引起的，非IE的留白是由padding引起的（margin和padding大概為40px）。
只要對清單元素進行了浮動，在IE中，列表前的默認序號（圓點或阿拉伯數字，即list-style-type）就會消失無形；而在非IE中卻是正常的。 原因就是margin和padding。
因為預設情況下的序號位置list-style-position為outside，這就要求必須為序號出現預留位置，或margin或padding。 而要解決這個問題，就得想辦法讓序號出現不需要預留位置，預設outside是需要留白才能顯示的，所以就更換為inside。
ul { list-style-position:inside; float:left; } - CSS裡定義hr，解決ie與ff會出現重覆線段問題
hr{ height:1px;border:none;border-top:1px dashed #000;}
hr預設高度即為1px;
先將border設為取消，再從新對border下樣式!
常用:
- ie中如何讓超出寬度的文字顯示為省略號？
定義：overflow:hidden; width:xxx; white-space:nowrap; text-overflow:ellipsis; - 如何讓min-height兼容ie6?
.min-height{min-height:100px; _height:100px;} - 區別display:none與visibility:hidden?
相同的是display:none與visibility:hidden都可以用來隱藏某個元素；
不同的是display:none在隱藏元素的時候，將其占位空間也去掉；而visibility:hidden只是隱藏了內容而已，其占位元空間仍然保留。 - CSS的滑鼠為手形
IE，設置CSS的滑鼠為手形，通常用：cursor：hand; 但這在Firefox下是無效的。
cursor：pointer; 這在IE和Firefox下都是通用的。
基本觀念:
- CSS宣告
（document type definition）。這個經常被人刪掉，弄出一些奇怪的錯誤:( 如果使用dreamweaver作為編輯器，新建一個檔，這個就自動加上了，但是純手寫代碼的時候很容易忘記。)
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"> - 理解塊元素(block element)與內聯元素(inline element)元素
塊元素(block element)與內聯元素(inline element)元素對於web製作是很重要的。
依據元素顯示(display)時的表現，可以看出，所有可見元素中，不是塊元素的就是內聯元素。
可以這樣想像一下，塊元素是一個大的框架，用於搭建大體結構，而內聯元素，就是用來組成細節和更具體的部分了。
開始web製作時，通常都會用塊元素先搭出一個架子，確定大框架的結構，然後往裡面添加內聯元素，作為細節的構造。
塊元素和內聯元素的表現有什麼不同呢？ 嘗試寫一點代碼就可以看出來區別了
<div>我是塊元素div</div>
<div>我是塊元素div</div>
<p>我是塊元素p,<span>我是內聯元素span</span>,<span>我也是內聯元素span</span>,<em>我是內聯元素em</em></p>
<ul>
<li>ul,li 都是塊元素哦</li>
<li>ul,li 都是塊元素哦</li>
</ul>
結果如下↓
我是塊元素div我是塊元素div我是塊元素p,我是內聯元素span,我也是內聯元素span,我是內聯元素em
- ul,li 都是塊元素哦
- ul,li 都是塊元素哦
區別就可以看出來了：一個塊元素占了一行，兩個塊元素不會在同一行，而內聯元素就不一樣了，它們在同一行上依次排開，遇到邊界才會換行。
<div>,<p>,<h1>,...<h6>,<blockquote>都是塊元 素，<q>,<a>,<em>,<img>都是內聯元素。
另外，像<meta>,<head>...這些不可見元素不在它們的範圍之內，這些不可見元素我們稱為頂級元素(top element)。
在書寫CSS的時候，內聯元素的高度寬度都是不可以設置的，其寬度就是自身文字或者圖片的寬度。
............持續更新
全站熱搜
留言列表
分享 (6)
