轉自 藍色理想 作者 bias 原文地址 http://www.blueidea.com/tech/site/2006/3296.asp 之前找了幾個不同版本的可獨立啟動並執行IE瀏覽器，正好拿來試試頁面的相容性問題。不試不知道，在IE6和FF中沒問題的頁面在IE5和IE5.5中亂成一團，一直聽說IE5是WEB標準製作的一個“釘子戶”，現在不得不相信了。
需要的一張圖片： <html><head><title>aa</title> <style type="text/css"> div{ width:0px; background:url(/upload/20077101039968.gif) } table{ letter-spacing:10px; font-size:60px; font-weight:900;
在編寫css樣式表的時候常常會碰到一寫瀏覽器安全色的問題，象是不同核心的瀏覽器顯示就不一定相同，不同版本的的瀏覽器也會產生上下相容的問題，如何解決這些問題成了我們苦惱的問題，如果你對css hack技術很瞭解的話，那這就是太簡單不過了，不過對於那些不怎麼解的人來說可真成了他們所苦惱的事。在這就從 趙磊官方部落格 引來一篇文章來介紹相容各個瀏覽器的技巧。但是你也不要認為只要是瀏覽器顯示出現差錯就事瀏覽器的問題，也很可能是你的結構不好，建議你好好去學習一下語義結構，畢竟蓋房子要先搭鋼筋的。
本文為翻譯文章，全文地址：http://diger.cn/article.asp?id=351原文地址：http://www.filamentgroup.com/lab/buttonElement/Particle Tree
css中的行間距的代碼_經驗交流Css中行間距定義是： line-height:18px;上面代碼是將行間距設為18px。長期以來，我在定義字型樣式的時候，通常是這樣： #myFont{ font:12px tahoma; line-height:18px; }今天才發現，原來可以寫成一行，修改如下： #myFont{ font:12px/18px tahoma;
利用了CSS2 的 相鄰選擇符 IE7以下不支援 隔行換色樣本: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 放棄class與js實現隔行換色效果 12121212 12121212 12121212 12121212 12121212 隔列換色樣本： "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
十分鬱悶的問題，看下我原來寫的代碼： 無標題文檔 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行] 居然出現了水平捲軸，問題是我定義的寬度才950px啊！最後還是在網友的協助下，發現了原因： 1 可以直接把body的css改為: body{width:990px; margin:0; padding:0;} 2 可以添加：* {margin:0;padding:0;}添加後運行效果： 無標題文檔
scrollHeight: 擷取對象的滾動高度。 scrollLeft:設定或擷取位於對象左邊界和視窗中目前可見內容的最左端之間的距離 scrollTop:設定或擷取位於對象最頂端和視窗中可見內容的最頂端之間的距離 scrollWidth:擷取對象的滾動寬度 offsetHeight:擷取對象相對於版面或由父座標 offsetParent 屬性指定的父座標的高度 offsetLeft:擷取對象相對於版面或由 offsetParent 屬性指定的父座標的計算左側位置
scrollWidth,clientWidth與offsetWidth的區別_經驗交流scrollWidth 是對象的實際內容的寬，不包邊線寬度，會隨對象中內容的多少改變（內容多了可能會改變對象的實際寬度）。 clientWidth 是對象可見的寬度，不包捲軸等邊線，會隨視窗的顯示大小改變。 offsetWidth 是對象的可見寬度，包捲軸等邊線，會隨視窗的顯示大小改變。 一個scrollWidth和clientWidth的例子： <html> <head>
最近在做網站的時候碰到了一個問題：我用 ul 標籤和 li 標籤構建的導覽列想要在不確定 li 數量和 li, ul 寬度的情況下置中，但是給 ul 使用了 text-align:center 之後卻沒有起到應有的效果。 原來的頁面結構是： 複製代碼 代碼如下: Firede Style5 樣式表結構是： 複製代碼 代碼如下: 這樣本來也是沒有什麼問題的，但是因為要實現一個功能卻定義了一個ID（menu）和兩個CLASS（menu_ul, menu_li）
關於超連結中的底線這個及細節的問題，想必大家都有過討論和思考，大家都知道，把握一個原則即可：“讓使用者清楚的區分超連結文本和其他文本形式，並潛意識知道可以點擊。”；但對於是否可以潛意識知道可以點擊，還是有爭議的，不同的人，不同的環境會有不同的見解。不妨分幾個情境討論一下：1. 導航地區，潛意識我會去點擊。即便有底線也是個“古老形式”的擺設，所以一般沒有底線；好的設計不僅滿足點擊，還滿足視覺的層級關係。2.
SPAN 和 DIV 的區別在於，DIV(division)是一個區塊層級元素，可以包含段落、標題、表格，乃至諸如章節、摘要和備忘等。而SPAN 是行內元素，SPAN 的前後是不會換行的，它沒有結構的意義，純粹是應用樣式，當其他行內元素都不合適時，可以使用SPAN。 下面以一個執行個體來說明這兩個屬性的區別。 代碼：
一、關於注釋 在建立xhtml+CSS網站時，CSS中的注釋非常重要。在建立CSS樣式時，應當保持隨手注釋的習慣。一般的，我習慣於使用“/* 注釋內容 */”的格式來寫注釋，因為在EditPlus等具有高亮功能的編輯器裡，使用C語言中常用的“/***************/”之類的注釋是無意義的，沒有必要填充大量無意義內容作為分隔。帶有注釋的文檔作為網站的原始CSS文檔，在發布網站的時候，可以使用CSS壓縮公用程式壓縮CSS，在輸出的CSS中去掉注釋以提高檔案傳輸效率。 二、關於命名
今天在標準之類的blog(http://www.aa25.cn)看到"純CSS代碼實現翻頁" 的文章 123 [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]也許很多人對HTML的UL,OL,LI標籤可能都比較熟習,但是對DL,DT,DD可能就不怎麼瞭解了,那麼到W3.ORG去看看吧,
消除鋸齒圓角 This is content here http://www.spiffycorners.com/index.php?sc=spiffy&bg=3847B4&fg=D68A88&sz=3px [Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
常用的DIV+CSS的基本架構結構但不推薦都放一個div裡css樣式代碼： 程式碼複製代碼 代碼如下:/*---全域樣式---*/ * { margin:0px; padding:0px;} body {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;background:#fff;} /*---主體樣式---*/ #container {} .clearfloat
1 針對firefox ie6 ie7的css樣式 現在大部分都是用!important來hack，對於ie6和firefox測試可以正常顯示，但是ie7對!important可以正確解釋，會導致頁面沒按要求顯示！找到一個針對IE7不錯的hack方式就是使用“*+html”，現在用IE7瀏覽一下，應該沒有問題了。 現在寫一個CSS可以這樣： #1 { color: #333; } /* Moz */ * html #1 { color: #666; } /* IE6 */ *+html #1 {
超強推薦CSS打造經典滑鼠觸發顯示選項PHP代碼<!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>
符合XHTML標準DIV+CSS布局的網站，下面說說在SEO方面的影響。 代碼精簡 使用DIV+CSS布局，頁面代碼精簡，這一點相信對XHTML有所瞭解的都知道。代碼精簡所帶來的直接好處有兩點：一是提高spider爬行效率，能在最短的時間內爬完整個頁面，這樣對收錄品質有一定好處;二是由於能高效的爬行，就會受到spider喜歡，這樣對收錄數量有一定好處。 表格的嵌套問題
在藍色上看到這篇文章的，感覺作者總結的不錯，至少有些偶自己也沒有真正的認識過。這些 東西的確是應該好好總結一下的，可惜偶這人比較懶，收藏整理於此，便於自己學習！ 1.firefox不能對innerText支援。 firefox支援innerHTML但卻不支援innerText，它支援textContent來實現innerText，不過預設把多餘的空格也保留了。如果不用textContent，如果字串裡面不包含HTML代碼也可以用innerHTML代替。 2.禁止選取網頁內容：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
