CSS

用作圖工具作一個漸層的長度.看起來能好看一點(寬:187px;高15px) 本來設想是當12%時,圖片從左到12%的位置顯示,餘下的88%不顯示,但不佔地(看起來和1px的圖片底沒什麼區別).下午時去網羅了一班.發現不佔地是不太可能的. 要隱藏圖片餘下的百分比,先想到了評分.亮和暗用了一張圖片,各占圖片總高度的一半.我寫下了: <div style="background:url(...) 12% left;width:187px;height:15px;"></div>

假定有二個BOX，我們需要它的最小高度為150PX。 CSS div.box1,div.box2{ width: 300px; min-height: 150px; background: #EEE; float: left; margin-right: 20px; } xhtml <div>IE中沒保持最小高度為150px</div> <div>最小高度可以設定一個BOX的最小高度， 當其內容較少時時，也能保持BOX的高度為一定</div>

1、對於沒有中劃線的css屬性一般直接使用style.屬性名稱即可。 如：obj.style.margin，obj.style.width，obj.style.left，obj.style.position等。 2、對於含有中劃線的css屬性，將每個中劃線去掉並將每個中劃線後的第一個字元換成大寫即可。 如：obj.style.marginTop，obj.style.borderLeftWidth，obj.style.zIndex，obj.style.fontFamily等。

content[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]終於見識了這個變態的IE7，象霧象雨又象風，IE系列的CSS hack: * html它認；Firefox的CSS hack: html>body、#id[id]、html[xmlns] div這樣的東東它也認，教我說它什麼好呢！ 最終通過無敵 * 解決了它！

作者：洛科先看這一句 複製代碼 代碼如下:<a href='#' onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor='default'" onclick="document.getElementById('ShowContent').innerHTML='';return false;"> <img alt="清空螢幕" src="UI/clear.gif" style="border:0"

只要觸發IE的hasLayout，非浮動元素就會擁有布局。所以，利用IE6特有的hack規則，為它單獨寫樣式就可修複此問題： _zoom:1; margin-left: value; _margin-left: value-3px; zoom 是IE觸發Layout條件之一，因為它是IE特有的CSS規則，所以採用zoom。 margin-left: value-3px 是修複IE6 中3px 的bug。 此前採用非浮動元素也浮動的方法修複bug，現在我們可以試試這個新的方法了！

本來還以為這塊是由後台單獨去做的，今天看到這種效果，居然是CSS實現的。現在將它放到這裡與大家共用 精選1.指令碼代碼收藏站,AJAX/JS/ASP/PHP一網打盡[精選]！2.看書了小說網！3.中文最強大的搜尋引擎！4.指令碼之家，下載中心！5.指令碼之家新增加photoshop，flash，製作教程經典收藏！[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

圖片新聞一 圖片新聞二 圖片新聞三 圖片新聞四 1 2 3 4 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

BI上有高手專門討論了這種布局方法，但他用了較多的hack，還迴避了IE6的dtd。我在實際使用中，發現迴避掉IE6的dtd定義後，會導致ajax模態框無法置中（VS的一個控制項，自動產生的程式碼，很難修改）。 於是自己寫了個簡單的左右兩列的布局，沒用到什麼hack，很簡單，只是練手用用。

看到一些網站的頁中大部分是這樣寫的 <style type="text/css" media="screen"> @import url("http://www.jb51.net/home/css/global/v2.0.css?t=20070518.css"); </style> 　　而很多網站使用的都是link <link rel="stylesheet" rev="stylesheet" href="default.css" type="text/css"

CSS的功能是非常強大的，對於元素的表現以及頁面的布局，都提供了非常強大的功能，這主要在於我們靈活的運行，在這方面提供了豐富且富含價值的各種教程與資訊。對於圖片的使用，其實更多的是在內容層。根據WEB標準的思路，表現層的圖片，已經都被分離到CSS中去了。只有作為內容的圖片才能以IMG標籤插入在頁面中，這也是一直強調的語義。

1、如果在樣式檔案或分頁檔代碼中直接用display:none對元素進行了隱藏，載入頁面後，在沒有通過js設定樣式使元素顯示的前提下，使用js代碼會無法正確獲得該元素的一些屬性，比如offSetTop,offSetLeft等，返回的值會為0，通過js設定style.display來使元素顯示後才能正確獲得這些值。 2、使用display:none隱藏的元素不會被百度等搜尋網站檢索，會影響到網站的SEO，某些情況下可以使用left:-100000px來達到同樣效果。

1、很多相容性問題，是因為不同標籤在不同瀏覽器下有著不同的 padding margin預設值。所以可以事先定義 複製代碼 代碼如下:* { padding：0; margin:0;} 或者 複製代碼 代碼如下:ul,li,h1,h2,h3,h4,h5,h6,p,table,td,div,img,hr,dd,dt,span,a,dt,dd,ol{margin:0;padding:0;font-size:12px;} 2、關於布局，可以看dreamweaver

在CSS Expression中使用JavaScript運算式。CSS屬性根據JavaScript運算式的計算結果來設定。 CSS Expression在其它瀏覽器中不起作用，因此在跨瀏覽器的編碼中單獨針對IE設定時會比較有用。 從IE5開始支援CSS Expression。我們看下面的代碼： 複製代碼 代碼如下:background-color: expression( (new Date()).getHours()%2 ? "#F00" : "#00F" ); 上面的代碼是使用CSS

當你看到<input>這個html標籤的時候，你會想到什嗎？一個文字框？一個按鈕？一個單選框？一個複選框？……對，對，對，它們都對。也許你可能想不到，這個小小的input竟然可以創造出10個不同的東西，下面是個列表，看看，哪些是你沒有想到的：<input type="text" /> 文字框 <input type="password" /> 密碼框 <input type="submit" /> 提交按鈕 <input

屏蔽IE瀏覽器（也就是IE下不顯示）複製代碼 代碼如下:*:lang(zh) select {font:12px !important;} /*FF 可見，特別聲明：由於Opera最新的更新，此句目前已經成為FF的專用HACK*/ select:empty {font:12px !important;} /*safari可見*/ 這裡select是選擇符，根據情況更換。第二句是MAC上safari瀏覽器專屬的。僅IE7識別複製代碼 代碼如下:*+html {…}

Cascading Style Sheets: The Definitive Guide, 2nd Edition is a thorough review of all aspects of CSS2.1 and a comprehensive guide to CSS implementation. The book includes new content on positioning, lists and generated content, table layout, user

在下不才，歸納幾點html編碼要素，望能指點各位：1.文字本身的大小不相容。同樣是font-size:14px的宋體文字，在不同瀏覽器下占的空間是不一樣的，ie下實際占高16px，下留白3px，ff下實際占高17px，上留白1px，下留白3px，opera下就更不一樣了。解決方案：給文字設定 line-height 。確保所有文字都有預設的 line-height 值。這點很重要，在高度上我們不能容忍1px 的差異。 2.ff下容器高度限定，即容器定義了height之後，容器邊框的外形就確定了，

複製代碼 代碼如下:<div id="macji"> <ul class="macji-skin"> <li>列表一</li> <li>列表二</li> <li>列表三</li> </ul> </div>

使用 line-height 垂直置中 line-height:24px; 使用固定寬度的容器並且需要一行垂直置中時，使用 line-height 即可（高度與父層容器一致），更多的垂直置中總結可以看這裡。 清除容器浮動 #main { overflow:hidden; } 期前也提到過這樣的問題，更多資訊可以看這裡。 不讓連結折行 a { white-space:nowrap; } 上面的設定就能避免連結折行，不過個人建議長連結會有相應的這行（有關換行方面的討論，參看圓心的記錄）。 始終讓