CSS

什麼是hasLayout？hasLayout 是IE特有的一個屬性。很多的ie下的css bug都與其息息相關。在ie中，一個元素要麼自己對自身的內容進行計算大小和組織，要麼依賴於父元素來計算尺寸和組織內容。當一個元素的 hasLayout屬性值為true時，它負責對自己和可能的子孫元素進行尺寸計算和定位。雖然這意味著這個元素需要花更多的代價來維護自身和裡面的內 容，而不是依賴於祖先元素來完成這些工作。下列元素預設 hasLayout=true <table> <td>

如何編寫CSS代碼才能更有效率？這是許多網頁製作者與開發人員都關心的問題。大概沒有什麼魔法，可以保證一下就把你的樣式表縮小到百分之多少，但合理的 CSS 編碼與組織技巧，的確能夠協助你的更有效率地寫出更清晰高效的代碼，自然，樣式表大小的縮減還能減少下載的時間。一、排版：1、關鍵詞和操作符之間加適當的空格。2、相對獨立的程式塊與塊之間加空行3、較長的語句、運算式等要分成多行書寫。4、劃分出的新行要進行適應的縮排，使排版整齊，語句可讀。5、長運算式要在低優先順序操作符處劃分新行，操作符放在新行之首。

  Code highlighting produced by Actipro CodeHighlighter

如果在用CSS設計布局時遇到BUG，請認真閱讀以下內容，非常容易記憶的，不知道哪位高人把CSS BUG編成了順口溜了！看看好不好記住呢？ 一、IE邊框若顯若無，須注意，定是高度設定已忘記；二、浮動產生有緣故，若要父層包含住，緊跟浮動要清除，容器自然顯其中； 三、三像素文本慢移不必慌，高度設定幫你忙； 四、相容各個瀏覽須注意，預設設定行高可能是殺手； 五、獨立清除浮動須銘記，行高設無，高設零，設計效果兼瀏覽；

Code highlighting produced by Actipro CodeHighlighter

這絕對位置元素蓋住連結或添加某事件handle的元素後，那麼該連結的預設行為（頁面跳轉）或元素事件將不會被觸發。現在Firefox3.6+/Safari4+/Chrome支援一個稱為pointer-events的css屬性。使用該屬性可以決定是否能穿透絕對位置元素去觸發下面元素的某些行為。如下：Baidu BaiduSPAN

要求三個面板（有指定寬度）並排，面板中有內容，內容的寬由標題確定，並且置中對齊，內容的其他段落與標題靠左對齊。 <div> <center class="float_left"> <span> <h2>這個比較短 <P>2013</p>

對於Web開發人員來說，找到有用的CSS工具，就像找到一個魔燈，可以讓他那些艱難的任務變得有趣。CSS工具協助開發人員創造更時尚，更有創意的網站。在這篇文章中收集了15個有用和強大的CSS工具，記得收藏起來哦。CSS3 Generator – By Eric Hoffman and Peter Funk 一款很棒的CSS3樣式線上產生工具，由Eric Hoffman設計，Peter Funk開發。CSS Pattern Generator Patternify

IE6下連結偽類（:hover）CSS背景圖片有閃動BUG，主要原因ie會再一次請求這張圖片，或者說圖片沒被緩衝。例如：CSS代碼a:hover{background:url(imagepath)}  常用的解決方案：在頁面底部添加以下IE6專用代碼，讓IE6緩衝CSS背景圖片至本地，這樣a:hover時IE6就不會再重新向伺服器請求載入背景圖片了。XML/HTML代碼<!–[if IE 6]>  <script type=”text/javascript”>  docu

       那天瓜哥講了個問題，說說css HACK的一些看法，說說自己的想法，不對多指教。        由於各種瀏覽器對css的解析存在差異，使同一頁面在各種瀏覽器下表現出來的效果也會不同。為瞭解決這個相容性問題，css hack技術產生了。        個人認為css hack技術其實是一種欺騙瀏覽器的技術，通過在選取器、屬性等地方添加一些特別符號來使某些瀏覽器無法解析該選取器或屬性，以達到區分不同的瀏覽器的目的。其實個人覺得css hack是不安全的，有風險的，現在的瀏覽器更新很快，

受阿一同學的啟發俺也來發個小東西.雖然很喜歡editplus的小巧快速，但是很遺憾它不支援代碼的自動格式化，現在寫php,css,html都是用的Aptana，這個感覺不錯。今天正好看了一下editplus的使用者工具，它允許通過命令列調用和標準輸出輸出與其它程式進行互動，可以傳入參數可以手動指定，也可以是當前選定內容，當前本件所有文本等，即然這樣我們就利用它的filter模式，即把所有常值內容傳過去，再使用回傳內容替換當前文本。那麼我們還需要一個外部工具，為了方便起見，指令碼類語言當然是首選，

一般來說，上傳控制項不是用flash做就是用input[type=file]元素了，但flash在IPAD上沒救了，而input[type=file]在各種瀏覽器中又長得不是一個樣子，因此已經我們需要用CSS來處理一下。聽說webkit可以用-webkit-appearance:none;清除預設樣式，就可以讓你為所欲為了。但天朝的炮灰們（有些公司喜歡稱我們為前端攻城師，那豈不就是炮灰吧，每改設計一次就爛頭焦額，半死不活），是用不起這麼進階的東東，我們還要相容IE6呢。最後問群裡的大大，找到解決

自動換行 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->div{  word-wrap: break-word;  word-break: normal;  }  強迫不換行  Code highlighting produced by Actipro CodeHighlighter

    這項CSS技術是利用利用對一張背景圖片的絕對位置來實現減少HTTP請求，從而達到網頁提速。CSS sprite最適合作用於背景表徵圖或是背景裝飾性的圖片。    就是把許多背景圖片整合成一張背景圖片，然後通過限制要使用背景圖片的元素的寬高，再通過background-repeat, background-position來對圖片進行定位，這樣做的好處就是減少網頁載入時的HTTP請求，因為你每使用一張背景圖片，載入網頁時就會發出一個HTTP請求。    CSS

FF , OPERA , SAFARI , IE7 , IE8 方法如下： Code highlighting produced by Actipro CodeHighlighter

在進行浮動布局時，大多數人都深知，在必要的地方進行浮動清理：<div style=”clear:both;”></div>。例如：<div style=”background:#666;”>       <div style=”float:left; width:30%; height:40px;background:#EEE; “>Some

外部參考CSS中

 通過背景的靠左對齊和靠右對齊用A標籤和span標籤組合出一個完整的圓角矩形。再通過hover標籤去滑動圖片。 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><style type="text/css">html , body , div , span , p , img , a , ul , li , table , tr , td 

網頁開啟與瀏覽速度受著多方面因素的影響，客戶網速是一個方面，另外網站開發的編碼方式也將對使用者的電腦產生負擔，在之前的文章中提過這方面的內容。這篇文章主要寫的提高網頁在用戶端瀏覽器的渲染速度的CSS部分。　　一、*{} #page *{}

屬性選取器（Attribute Selectors），或許你不應該對屬性選取器感到生疏，從本質上說，id跟類別選取器其實就是屬性選取器，只不過是選擇了id或者類的值（value）而已。　　屬性選取器的格式是元素後跟中括弧，中括弧內帶屬性，或者屬性運算式（不知道描述是否正確，自創的詞），比如h1[title], h1[title="Logo"]等，你可以從我下面的論述中看到4種具體形式。注意 屬性選取器 ie6