CSS

也許已經有人發現可以這樣寫... CSS代碼部分 a.info {     position:relative; z-index:0; background-color:#ccc; color:#000; text-decoration:none } a.info:hover {

文總結了我開始使用CSS布局方法以來所有的技巧和相容方案，我願意把這些與你分享，我會重點解釋一些新手容易犯的錯誤(包括我自己也犯過的)，如果你已經是CSS高手，這些經驗技巧可能已經都知道，如果你有更多的，希望可以幫我補充。 翻譯:阿捷 原文作者:Roger Johansson作者簡介:住在瑞典哥德堡，1994年開始接觸和參與web設計，456 Berea Street是他的住址，因此採用這個名字作為他的個人首頁網域名稱最近，經常有朋友問我一些工作中遇到的CSS問題。他們總是不能很好的控制CSS，

字型的處理在網頁設計中無論怎麼強調也不為過，畢竟網頁使用來傳遞資訊的，而最經典最直接的資訊傳遞方式就是文字，所以，瞭解一點字型的基本知識對於設計來說還是非常重要的。 　　 中文和英文的最大區別就是中文是方塊字，英文是拼音文字，這對字型的處理的影響是巨大的。看看下面的圖示就會發現，英文字型裡的那些變化在中文字型裡都弱化了。　　 作為中文的讀者，習慣性的接受方塊形狀做為閱讀的單元，其實對於眼睛來說，這是一種容易疲勞的方式，閱讀的時候你的視線實際上是跟隨整行文字的外形。看看這個例子。　　 NOW I'

IE5及其以後版本支援在CSS中使用expression，用來把CSS屬性和Javas?cript運算式關聯起 來，這裡的CSS屬性可以是元素固有的屬性，也可以是自訂屬性。 　CSS屬性後面可以是一段Javas?cript運算式，CSS屬性的值等於 Javas?cript運算式計算的結果。?在運算式中可以直接引用元素自身的屬性和方法，也可以使用其他瀏覽器對象。這個運算式就好像是在這個元素的一 個成員函數中一樣。

不少網站開始採用韓式風格來建站.一般人都會想到用Photoshop等軟體來完成這樣的效果，但如果網頁上這類圖片太多，或是較大時，會給訪問帶來一定的困難。這裡就給大家講一講如何用CSS來做這樣的風格，因為用CSS只是對顏色的定義，少了圖片的應用，所以基本不會影響速度。      這種風格的特點是色彩變化豐富、應用Flash動畫合理、結構新穎，最明顯的特點就是表格或標題列常會加上一條橫或豎的色帶，如圖中圈起來的地方就是這樣:　　　 　　

先來看張圖片：        原理就是通過背景的靠左對齊和靠右對齊用A標籤和span標籤組合出一個完整的圓角矩形。再通過hover標籤去滑動圖片。而你只需要一張圖片：ok，看看代碼吧。 CSS: 複製代碼 代碼如下:*{margin:0; padding:0;}   body{padding:10px; font-size:12px;}   h1{margin:0; 

CSS條狀圖表是我們在網頁設計中常常會遇到的一種形式。條狀圖表可以將數量，以條狀圖形的形式直觀的表示出來。  　　CSS基本條狀圖表的實現方法是什嗎？我們看下面的執行個體介紹：  複製代碼 代碼如下:<div class="graph">   <strong class="bar" style="width: 24%;">24%</strong>  

www.jb51.net CSS Templates Free Download CSS WebSites Showcase CSS Web Design Article [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]韓國網站的設計風格特徵鮮明，色彩明快，現在越來越多的人正在模仿這種風格。 

作者：Cutsin 原文地址：http://www.moonless.net/blog/2007/09/csspositionz-index.html 註：本文僅供交流使用，如有不當之處歡迎批評指正，但請註明詳由，謝謝！

我們應該養成良好的編碼習慣，CSS整體布局聲明為我們的代碼簡化、提高運行效率提供了途徑。我們列舉比較常用的形式，並加上解釋。整體布局聲明的作用在於將目標作一個整體的概括，聲明一些完全相同或基本相同的屬性及值，以免在後面的代碼中每一個標籤中都需要單獨定義。若有不同的屬性與值，後面的重新定義即可。 一、通配式整體布局聲明。 * { margin:0; padding:0; font-size:0.8em; ... }

徹底放棄表格版面配置，使用xhtml+CSS建站也已經有一年多了。一年多的實踐也積累了一定的經驗，現在寫這篇文章來總結一下。在使用xhtml+CSS建站的過程中有一個比較關鍵的問題：網站的CSS樣式表規劃與管理。 我的CSS管理進化史

如何在網頁中插入CSS  前面我們瞭解了CSS的文法，但要想在瀏覽器中顯示出效果，就要讓瀏覽器識別並調用。當瀏覽器讀取樣式表時，要依照文字格式設定來讀，這裡介紹四種在頁面中插入樣式表的方法：鏈入外部樣式表、內部樣式表、匯入外表樣式表和內嵌樣式。  1. 鏈入外部樣式表 

常用的DIV+CSS的基本架構結構但不推薦都放一個div裡css樣式代碼：  程式碼複製代碼 代碼如下:/*---全域樣式---*/  * { margin:0px; padding:0px;}  body {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;background:#fff;}&

一、關於注釋 在建立xhtml+CSS網站時，CSS中的注釋非常重要。在建立CSS樣式時，應當保持隨手注釋的習慣。一般的，我習慣於使用“/* 注釋內容 */”的格式來寫注釋，因為在EditPlus等具有高亮功能的編輯器裡，使用C語言中常用的“/***************/”之類的注釋是無意義的，沒有必要填充大量無意義內容作為分隔。帶有注釋的文檔作為網站的原始CSS文檔，在發布網站的時候，可以使用CSS壓縮公用程式壓縮CSS，在輸出的CSS中去掉注釋以提高檔案傳輸效率。

1. Block和inline元素對比 所有的HTML元素都屬於block和inline之一。 block元素的特點是： 總是在新行上開始； 高度，行高以及頂和底邊距都可控制； 寬度預設是它的容器的100%，除非設定一個寬度 <div>, <p>, <h1>, <form>, <ul> 和 <li>是塊元素的例子。 相反地，inline元素的特點是： 和其他元素都在一行上； 高，行高及頂和底邊距不可改變；

在藍色上看到這篇文章的，感覺作者總結的不錯，至少有些偶自己也沒有真正的認識過。這些 東西的確是應該好好總結一下的，可惜偶這人比較懶，收藏整理於此，便於自己學習！ 1.firefox不能對innerText支援。 firefox支援innerHTML但卻不支援innerText，它支援textContent來實現innerText，不過預設把多餘的空格也保留了。如果不用textContent，如果字串裡面不包含HTML代碼也可以用innerHTML代替。 2.禁止選取網頁內容：

在編寫css樣式表的時候常常會碰到一寫瀏覽器安全色的問題，象是不同核心的瀏覽器顯示就不一定相同，不同版本的的瀏覽器也會產生上下相容的問題，如何解決這些問題成了我們苦惱的問題，如果你對css hack技術很瞭解的話，那這就是太簡單不過了，不過對於那些不怎麼解的人來說可真成了他們所苦惱的事。在這就從 趙磊官方部落格 引來一篇文章來介紹相容各個瀏覽器的技巧。但是你也不要認為只要是瀏覽器顯示出現差錯就事瀏覽器的問題，也很可能是你的結構不好，建議你好好去學習一下語義結構，畢竟

div+css還是比較難搞的，要實現上下兩個div高度自適應感覺麻煩，查了下資料只找到上下高度都是百份比的是可以的，我要實現上面的div是具體像素高度，下面是自適應剩餘的百份比。自己搞了一下還要用上js，不知道是不是很笨，有好的方法請大家帖出來。 <body style=”height:100%; margin:0px; width:100%;”>

十分鬱悶的問題，看下我原來寫的代碼： 無標題文檔 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行] 居然出現了水平捲軸，問題是我定義的寬度才950px啊！最後還是在網友的協助下，發現了原因： 1 可以直接把body的css改為: body{width:990px; margin:0; padding:0;}

需要的一張圖片： aa 我是中國人 請輸入: jb51.net [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]