CSS

1. 匯入外部css：<link rel="stylesheet" type="text/css" href="skin/css/index.css"> 2. 橫排div#search { width: 10%;float: left;}float: left; 這個屬性讓search往左浮動，這樣它的後面（右邊）就可以放置別的元素。 3.兩個div連在一起，不留空隙#a { background: #ff0000; width: 70%;height: 20px;

隨著互連網經濟的不斷髮展，互連網上的專業網站、公眾服務網站以及企業門戶的數量都在飛速的增長，各網站的資訊量也呈爆炸性增長的趨勢。面對這些龐大的資訊量，我們對網頁中每一個欄目的增刪，都會是一個很複雜的過程。為了提高網頁的維護更新效率，我們可以使用樣式表，來僅僅改變一個檔案，就能達到同時改變幾百個網頁的外觀，而其個人化的表現未受任何損失。為了能充分用好樣式表的強大性和靈活性，筆者就怎樣有效使用樣式表，來談談自己的一些心得體會。1、在一個網頁中同時調用CSS的多種引入方式

Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><div style="background:#00f"><ul><li style="float:left">asdf</li></ul></div>

因為自己也寫了半年的移動端前端.發現此文章總結的很好.移動過來 http://adamlu.com/?p=633針對webkit的HTML, CSS和Javascript前面有一篇文章介紹了HTML5的一些新特性以及技巧, 現再來總結一些更多的針對webkit的HTML, CSS和Javascript方面的特性.HTML, 從HTML文檔的開始到結束排列:<meta name=”viewport” content=”width=device-width, initial-scale=1.0

1. position:static|無定位position:static是所有元素定位的預設值, 一般不用註明，除非有需要取消繼承的別的定位example:#div-1 { position:static;}2. position:relative|相對定位使用position:relative，就需要top,bottom,left,right4個屬性來配合，確定元素的位置。如果要讓div-1層向下移動20px,左移40px:example:#div-1

     各大主流瀏覽器對 CSS3 和 HTML5 的支援越來越完善，曾經讓多少前端開發人員心碎的IE系也開始擁抱標準。就在前幾天，W3C的 HTML5 社區領袖 Shelley 宣布，HTML5的開發工作已經接近完成，如果進展順利，HTML5 將在 2012 年正式成為國際標準。    當然，即使標準正式制定了，現代瀏覽器要普及到大部分使用者也是需要一個相當漫長的過程。如果你現在就希望使用 CSS3 和 HTML5

文章目錄 你是如何讓position:fixed在IE6中工作的？如何解決“震動”的問題？ 來源：http://www.qianduan.net/fix-ie6-dont-support-position-fixed-bug.html原文：http://subtlegradient.com/articles/2009/07/29/css_position_fixed_for_ie6.html  

1.用iepngfix樣本：http://www.twinhelix.com/css/iepngfix/demo/ ：http://www.twinhelix.com/css/iepngfix/優點：能夠整個頁面都能自動處理PNG-24的透明背景，不用特意去做另一幅圖片代替等麻煩。缺點：不能用太多，否則頁面載入速度大大變慢。***************************************************************************************

這裡引用的是Jorux的“95%的中國網站需要重寫CSS”的文章，題目有點嚇人，但是確實是現在國內網頁製作方面的一些缺陷。我一直也搞不清楚px與em之間的關係和特點，看過以後確實收穫很大。平時都是用px來定義字型，所以無法用瀏覽器字型放大的功能，而國外大多數網站都可以在IE下使用。因為1、IE無法調整那些使用px作為單位的字型大小；2、國外的大部分網站能夠調整的原因在於其使用了em作為字型單位；3、Firefox能夠調整px和em，但是96%以上的中國網民使用IE瀏覽器(或核心)。px像素（Pi

　　最近在網上看到1個很有意思的CSS擴充，這裡介紹給大家。LESS 最早是1個ruby的gem，用於擴充css的文法，用了LESS後，可以在css中使用變數，運算子，include,嵌套規則等等。現在LESS出了js版本，讓我們一起來看看LESS能為我們帶來什麼吧? 使用   1. 下載js: http://lesscss.googlecode.com/ 最新版本好像是 1.0.22   2. 使用less，css檔案的尾碼名需要改為.less。   3. 在html頁面中加入下面代碼    

 原文連結：http://www.fendou163.cn/article/20090115/24807.html　　Web網站可用性的關鍵計量是速度，更確切地說，是頁面能以多快的速度出現在訪問者的瀏覽器視窗裡。影響速度的因素有很多種，包括Web伺服器的速度、訪問者的Internet串連情況，以及瀏覽器必須下載的檔案大小。儘管你無法控制伺服器和串連的速度，但是你可以控制構成網站Web頁面的檔案大小。　　為了讓網站能夠更快，Web的建設者都會按常規地壓縮和最佳化網站上的每一個影像檔，這常常使得為了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css">.div{width:100%;height:25px;top:0

當多個浮動的元素彼此跟隨，中間加註釋的時候，最後一個浮動元素內的文本偶爾會複製到最下面去。學名Duplicate Characters Bug 程式碼 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="//www.w3.org/1999/xhtml">

(1) 如何?table的單像素border:table { border-collapse: collapse }(2) 假如不加<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

標準W3C盒子模型和IE盒子模型---CSS布局經典盒子模型2009-07-12 10:45　　盒子模型是CSS中一個重要的概念，理解了盒子模型才能更好的排版。其實盒子模型有兩種，分別是 IE 盒子模型和標準 W3C 盒子模型。他們對盒子模型的解釋各不相同，先來看看我們熟悉的標準盒子模型：  　　從可以看到標準 W3C 盒子模型的範圍包括 margin、border、padding、content，並且 content 部分不包含其他部分。　　IE 盒子模型  　　從可以看到 IE

盒子模型是CSS 中一個重要的概念，理解了盒子模型才能更好的排版。其實盒子模型有兩種，分別是IE盒子模型和標準W3C盒子模型。他們對盒子模型的解釋各不相同，先來看看我們熟悉的標準盒子模型： 從可以看到標準W3C盒子模型的範圍包括margin、border、padding、content，並且content 部分不包含其他部分。 IE

什麼是CSS hack由於不同的瀏覽器，比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等，對CSS的解析認識不一樣，因此會導致產生的頁面效果不一樣，得不到我們所需要的頁面效果。這個時候我們就需要針對不同的瀏覽器去寫不同的CSS，讓它能夠同時相容不同的瀏覽器，能在不同的瀏覽器中也能得到我們想要的頁面效果。這個針對不同的瀏覽器寫不同的CSS code的過程，就叫CSS hack,也叫寫CSS hack。CSS

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">   <head>   <meta http-equiv="Content-Type"

文章目錄 1.基本文法規範2.顏色值3.定義字型4.群選取器5.派生選取器6.id選取器6.類別選取器7.定義連結的樣式 在瞭解XHTML代碼規範後，我們就要進行CSS布局。首先先介紹一些CSS的入門知識。如果你已經很熟悉了，可以跳過這一節，直接進入下一節。CSS是Cascading Style Sheets(層疊樣式表)的縮寫。是一種對web文檔添加樣式的簡單機制，屬於表現層的布局語言。1.基本文法規範分析一個典型CSS的語句：p

文章目錄 1.定義DIV2.CSS2盒模型3.輔助圖片一律用背景處理 CSS布局與傳統表格(table)布局最大的區別在於：原來的定位都是採用表格，通過表格的間距或者用無色透明的GIF圖片來控制文布局版塊的間距；而現在則採用層(div)來定位，通過層的margin,padding,border等屬性來控製版塊的間距。1.定義DIV分析一個典型的定義div例子：#sample{ MARGIN: 10px 10px 10px