CSS

ISSN: 1534-0295. 20 October 2003 – Issue No. 160原文作者：Douglas Bowman 原文出自：A List Apart 中文翻譯：54player.com nobita 著作權說明：本文中文翻譯著作權歸譯者54player.com nobita所有。需要轉載發表的，請先與作者聯絡

本篇詳細介紹如何利用CSS能方便地控制對象的“顯示”和“隱藏”屬性原理，製作一個樹狀目錄，用CSS製作這樣的樹狀目錄，方法簡單，代碼也比較少，所以把它寫出來，給網友們共亨，以便在需要的時候也可動手做一個。 索易電子雜誌大多採用樹狀目錄，當滑鼠點擊主目錄時，展開子目錄；當再次點擊主目錄時，則關閉子目錄。顯得簡捷明快，樸實無華。

顯示/隱藏 顯示/隱藏 俺是個js初學者，獻醜了。這段js示範其實很簡單，俺在這裡只是想跟js大大們說一句：js是行為，不要跟樣式表打架。有些事還是該由css來做的，例如：display:none || display:block，簡直泛濫成災了！俺只會玩玩css，拿到js不會改，不敢改，唉。明明一個class就能甩給css做的事，js為啥要搶著做呢？搞得俺們這些會點css滴菜鳥們好是鬱悶~難道玩css就一定要會js嗎？ [Ctrl+A 全選

受朋友之託，我對hao123.com網站首頁進行了div+css的重新布局，精簡源碼，以適應現在的形勢。拿到hao123.com的首頁，首先對原來的布局進行了分析：源檔案的大小為80k，文字內容較多，圖片只有6個。布局不是很複雜分上中下三行，上部有5行： logo 廣告區、 一個 功能區、 郵箱登陸區、 百度搜尋欄、 最後是推薦。中部有兩行 每行有兩列 第一行左邊是分類導航， 右邊是名站導航和分類精選， 有1000px高， 第二行是酷站秀 和 四個門戶網站的導航連結。下部是幾個專題欄目，還有

這個是整頁代碼，你可以看著改了，也可以儲存成HTML檔案，完了試試看就知道了，主要用的CSS+DIV 上面的東西移到模板中，下面的東西也是一樣~完了就行了~ 文章內容頁廣告浮於左上方的解決辦法 廣告部分。 文章內容部分 文章內容部分 文章內容部分 文章內容部分 文章內容部分文章內容部分文章內容部分 文章內容部分 文章內容部分 文章內容部分 文章內容部分 

對於WEB前端頁面開發，字型大小的設定是比較重要，這裡找到了一些關於字型大小大小的資料，共用出來備以後參考，也希望能對大家有用！Points Pixels Ems Percent 6pt 8px 0.5em 50% 7pt 9px 0.55em 55% 7.5pt 10px 0.625em 62.5% 8pt 11px

擷取頁面高度，視窗高度，捲軸高度等參數值 擷取頁面高度，視窗高度，捲軸高度等參數值 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

利用 CSS + 標籤 來完成一個三角形的製作 M One M Two M Three M Four [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

在進行WEB標準網頁的學習和應用過程中，網頁對瀏覽器的相容性是經常接觸到的一個問題。其中因微軟公司的Internet Explorer(簡稱IE)佔據瀏覽器市場的大半江山，此外還有Firefox、Opera等。需要對這些瀏覽器進行相容。 同時，單就IE而言，因IE版本的升級更替，目前瀏覽者使用的主要停留在

inline style embeded style external style user style inline style是醜陋的，它們穿梭在HTML文檔中，與HTML元素扭成一團，給Web前端開發人員造成了許多麻煩。它們往往以這樣的面目出現： This is a paragraph. embeded style比inline style紳士一些，它們也寄宿在HTML文檔中，但是它們不屑於與HTML元素扭成一團。它們往往在 external

寫這個效果，可以熟悉以下： 1、相對定位中的絕對位置； 2、CSS 針對瀏覽器 HACK； 3、瞭解幾種邊框，以及可以實現的變化；以及加了邊框後，寬度和高度的計算方法； 4、感受浮動，浮動的東西只有多作一些，才會感受更深一些； 5、還可以熟悉一下小學的加減法；呵…… 很早以前我都是拿計算機在寫CSS。 首先，我先用FW畫一個小燈籠，在畫的過程中，我儘可能不出現圓角，並畫成等寬，等高、置中；因為這些屬性在CSS中都有！文字12號加粗！ 於是，開始想布局！這個布局太麻煩，我不得不用更多的標籤來完成，

區塊層級元素div盡量少用，其實和table一樣，嵌套越少越好，它也是會影響速度的！ ol 有序列表。 …… …… …… 表現為： 1…… 2…… 3…… ul 無序列表，表現為li前面是大圓點而不是123 …… …… 多人容易忽略 dl dt dd的用法 dl 內容塊 dt 內容塊的標題 dd 內容 以這麼寫： 標題 內容1 內容2 

層固定位置練習--by 阿會楠 指令碼之家 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]

當前標識指使用者點擊該頻道或欄目，該欄目的標籤呈現出與其他標籤不同的顏色用以提示使用者所處的位置。

幾乎被設計師遺忘了的標籤 Dascom News Last Amish shooting victim to be released from hospital Last Amish shooting victim to be released from hospital Last Amish shooting victim to be released from hospital Last Amish shooting victim to be

CSS條狀圖表是我們在網頁設計中常常會遇到的一種形式。條狀圖表可以將數量，以條狀圖形的形式直觀的表示出來。 　　CSS基本條狀圖表的實現方法是什嗎？我們看下面的執行個體介紹： 複製代碼 代碼如下: 24% 這是xhtml代碼，定義了一個容器，應用類graph，其中包括了一個xhtml元素strong，並且對這個元素應用類bar。 　　我們看下面的CSS定義： 複製代碼 代碼如下:.graph { position: relative; /* IE is

今天用了很久時間終於解決了這個問題，基本完美了，唯一不完美的就是 IE 6 只有在圖片完全下載完成後才會自動調整大小，不過聊勝於無，總比進入頁面後看到長長的橫向捲軸舒服的多，這裡使用了 expression，但是利用了一次載入，所以 expression 不會造成記憶體流失。當然，如果你有更好的解決方案，希望能與我交流。 代碼如下： .Image { max-width:600px;height:auto;cursor:pointer; border:1px dashed

在HTML 4.0 Strict和XHTML 1.0 STRICT裡不允許在標籤裡使用target屬性,這是一件令網頁設計者懊惱的事.在過渡的規範裡還是允許使用的.但通過一定的方法,我們可以解決這一問題.

為方便網站哀悼，特提供css濾鏡代碼，以表哀悼。以下為全站CSS代碼。 直接在*.css檔案最前面加入 body{ filter:Gray; }或者html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }均可 其他HTML頁面 html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]