CSS

CSS 圖片拼合 (CSS sprites) 可有效降低圖片檔案的 HTTP 串連請求數. 多個圖片將以一定間距合并為一個大圖片檔案. 頁面中使用這些圖片的元素將利用 background-position 這一 CSS 屬性來顯示拼合圖片中的指定位置.這一技術可有效提升網站效能, 尤其是網頁上有眾多小圖片時, 如許多功能表列表徵圖. Yahoo!

UL-LI 標籤結合CSS的運用在CSS布局中，ul,li的運用是非常常見的。配合DIV與CSS，建立無表格版面配置。其實Dreamweaver中也有內建的CSS布局的範例，如： LI代碼的格式化:A).運用CSS格式化列表符： ul li{list-style-type:none;} 例如下面的：供求資訊 B).如果你想將列表符換成映像，則： ul li{list-style-type:none;list-style-image: url(images/icon.gif); }

1. ResetPhoto by redux真的，要一直使用一個reset，無論是使用Eric Meyer Reset、YUI Reset、或者你自己的定製的reset，一定要使用。這可以簡單到僅僅將所有元素中的margin和padding屬性去掉:html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,pre, form, fieldset, table, th, td { margin: 0

from：http://homepage.yesky.com/55/2336055.shtml    

定位一直是WEB標準應用程式中的痛點，如果理不清楚定位那麼可能應實現的效果實現不了，實現了的效果可能會走樣。如果理清了定位的原理，那定位會讓網頁實現的更加完美。定位的定義：在CSS中關於定位的內容是：position:relative | absolute | static | fixedstatic 沒有特別的設定，遵循基本的定位規定，不能通過z-index進行層次分級。relative 不脫離文檔流，參考自身靜態位置通過 top,bottom,left,right

利用CSS來布局頁面配置DIV有點邏輯性!重點理解盒子模型,標準流和非標準流的區別,還有定位原理!把這3個攻破了,就非常簡單了!多實踐多參考!最後就是相容問題了,在實踐中自然就有經驗了!這些相容技巧都是經驗來的!        盒子模型有兩種，分別是 IE 盒子模型和標準 W3C 盒子模型。他們對盒子模型的解釋各不相同，先來看看我們熟悉的標準盒子模型：       　　圖片看不清楚？請點擊這裡查看原圖（大圖）。　　從可以看到標準 W3C 盒子模型的範圍包括

css樣式的rel屬性:rel屬性用於定義串連的檔案和html文檔之間的關係。rel=stylesheet指定一個固定或首選的樣式而rel="alternate    stylesheet"定義一個互動樣式。固定樣式在樣式表啟用時總被應用。連結標籤a的rel屬性超級連結<a>標記代表一個連結點，是英文anchor的簡寫。它的作用是把當前位置的文本或圖片串連到其他的頁面、文本或映像，這已是眾所周知了，但關於它的文法結構可能有點鮮為人知，而要用活它則必須瞭解其文法結構。<a>

在使用css對html文檔聲明樣式的時候，一般情況（即不考慮使用者進行樣式設定，只考慮開發人員和使用者代理程式-瀏覽器-）下，頁面樣式最終的體現是開發人員所寫的樣式和瀏覽器預設樣式的最終合作結果。實際上，從比較淺的層次來講的話，使用者代理程式的樣式無需考慮在內，一是因為使用者代理程式的樣式一般是display之類的基本樣式，而並非網頁中最具有展現意義的color、float等樣式；二則是因為使用者代理程式的樣式與開發人員的樣式相比較，總是後者優先。因此，在基本的hml文檔中樣式的處理上（常規情況

 第二天 文本布局和圖片布局文本布局：1）一個常見的上下左下右分塊布局：<!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-

以前的日曆選取器都是用table製作的，現在都是div+css時代了，這兩天就重寫了一個日曆選取器主要特點如下：用div

現在主流的瀏覽器分別是：Internet Explorer 6， Internet Explorer 7和Firefox 2。這讓我們在網站設計中不得不考慮如何使樣式“crossover”。這裡介紹一個較為簡單的方法使樣式的顯示效果在上述三種瀏覽器中保持一致。首先我們針對Firefox 2設計了如下的樣式代碼：#MyDiv { margin : 10px 10px 10px 10px; } 然後針對Internet Explorer 6進行樣式修改，使用如下的代碼語句，該代碼只能被 IE 6

這篇文章已經在草稿箱裡放了好久，考慮一下還是發布吧。這是翻譯的文章，原文在這裡Efficiently Rendering

下面的說明轉自網上，是一個朋友自己學習的經驗分享吧。我貼出來，大家多多注意，少犯錯誤。重要說明：android中的關鍵代碼：webview.getSettings().setJavaScriptEnabled(true);webview.addJavascriptInterface(object,"name");//把Name="name"的對象添加到object中。object如果是this，就是window.namewebview.loadUrl("file:///android_asset

此工具是漫畫綜合了網路上比較流行的一些JS混淆、壓縮、格式化、CSS壓縮、CSS格式化等流行的協助工具輔助改編而成，為了讓網友方便使用，漫畫把所有功能都分離出來，完全可以離線使用，無需考慮到要連網調用別人的介面才可以使用，完全本地化。 主要功能如下：1、JS混淆2、JS壓縮3、JS格式化4、CSS壓縮5、CSS格式化 部分核心代碼如下：var lCSSCoder = { format: function (s) {//格式化代碼 s = s.replace(/\s*([\{\

今天在寫一個頁面的時候，樣式表在添加中文注釋之後，發現在ie6下失效，網上搜到了原因，分享如下：由於css編碼和html編碼不一致，使得樣式表注釋之後失效。滿足下麵條件就會引起 注釋下面的樣式不起作用：1、css有中文注釋2、css為ANSI編碼3、html為utf-8編碼解決辦法：1、去掉中文注釋，用英文注釋2、統一css 和 html 的編碼建議採用第二種解決方案 ps：css為uft-8，html 為ANSI

原文連結：http://luinlee.com/405/ie6csschinese/1、終極方法：條件注釋。缺點是在IE瀏覽器下可能會增加額外的HTTP請求數。代碼Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><!–[if lte IE 6]> 這段文字僅顯示在 IE6及IE6以下版本。 <![endif]–><!–[

通常位移掉字型的方式是（1）使用text-indent:-9999px;可是他有一個局限性 他只適用於區塊層級元素block而我們往往有時候想位移掉的a上的字型所以問題就來了text-indent:-9999px;雖然用起來比較愜意將a轉化成block的話 往往 他身後的的元素就被他趕到下一行了如果正好這個a後面

HTML中，我們通常使用link元素引入外部樣式表，link有以下幾個屬性：1、rel，代表“關係”（relation），在這裡，關係（即rel值）為“stylesheet”；2、type，總是設定為“text/css”，描述了使用link載入的資料類型；3、href，值為樣式表的URL，可以是相對的也可以是絕對的；4、media，預設值是“all”，說明樣式表要運用於表現的媒體，還有其他取值：aural（用於語音合成器、螢幕助讀程式和文檔的其他聲音表現）、braille（用Braille裝置表

1、元素選取器：往往是HTML元素，也可能是XML定義的元素，舉例：h1 {color:red;}/* 元素選取器 */h2 {font:normal 12px/16px "Courier New",Arial;}/* css關鍵字由空格隔開，只有font屬性中字型大小和行高可用“/”分割 */h3,p {background-color:#EEE;}/* 選取器的分組 */2、通配選取器，它為頁面中所有元素添加樣式，就像是一個萬用字元，舉例：* {color:blue;}/*