Time of Update: 2018-12-08
今天用了很久時間終於解決了這個問題,基本完美了,唯一不完美的就是 IE 6 只有在圖片完全下載完成後才會自動調整大小,不過聊勝於無,總比進入頁面後看到長長的橫向捲軸舒服的多,這裡使用了 expression,但是利用了一次載入,所以 expression 不會造成記憶體流失。當然,如果你有更好的解決方案,希望能與我交流。 代碼如下: .Image { max-width:600px;height:auto;cursor:pointer; border:1px dashed
Time of Update: 2018-12-08
當你看到<input>這個html標籤的時候,你會想到什嗎?一個文字框?一個按鈕?一個單選框?一個複選框?……對,對,對,它們都對。也許你可能想不到,這個小小的input竟然可以創造出10個不同的東西,下面是個列表,看看,哪些是你沒有想到的:<input type="text" /> 文字框 <input type="password" /> 密碼框 <input type="submit" /> 提交按鈕 <input
Time of Update: 2018-12-08
古老的話題:一首古詩的分離 1.給你一首古詩,儲存為毫無格式的一堆文字,你去理解它的內容,進行結構的處理。用word排版之後,他有了結構 2.這個結構其實包含了語義和表現 3.用html進行結構化,拋開一切的表現形式,只考慮語義 4.用CSS進行表現處理,包括html的預設表現,他擁有了視覺表現,這個表現體現出了結構化,也體現出了使用者體驗,使用者體驗中包含了互動的排版和視覺體驗 5.如果加上行為,比如點擊注釋序號,緩緩跳轉到注釋內容。 再看看css禪意花園
Time of Update: 2018-12-08
屏蔽IE瀏覽器(也就是IE下不顯示)複製代碼 代碼如下:*:lang(zh) select {font:12px !important;} /*FF 可見,特別聲明:由於Opera最新的更新,此句目前已經成為FF的專用HACK*/ select:empty {font:12px !important;} /*safari可見*/ 這裡select是選擇符,根據情況更換。第二句是MAC上safari瀏覽器專屬的。僅IE7識別複製代碼 代碼如下:*+html {…}
Time of Update: 2018-12-08
Cascading Style Sheets: The Definitive Guide, 2nd Edition is a thorough review of all aspects of CSS2.1 and a comprehensive guide to CSS implementation. The book includes new content on positioning, lists and generated content, table layout, user
Time of Update: 2018-12-08
在下不才,歸納幾點html編碼要素,望能指點各位:1.文字本身的大小不相容。同樣是font-size:14px的宋體文字,在不同瀏覽器下占的空間是不一樣的,ie下實際占高16px,下留白3px,ff下實際占高17px,上留白1px,下留白3px,opera下就更不一樣了。解決方案:給文字設定 line-height 。確保所有文字都有預設的 line-height 值。這點很重要,在高度上我們不能容忍1px 的差異。 2.ff下容器高度限定,即容器定義了height之後,容器邊框的外形就確定了,
Time of Update: 2018-12-08
xmlns="http://www.w3.org/1999/xhtml">
Time of Update: 2018-12-08
IE直接用:word-break:break-all; /*允許詞內換行*/ word-wrap:break-word; /*內容將在邊界內換行*/ /*需要注意的預設是:*/ word-wrap:normal /*允許內容頂開指定的視窗邊界*/ 而firefox卻沒有很好的實現辦法 ,一個折中方案就是使用捲軸,但網上也提出了一種用js來判斷換行的辦法,這裡摘錄下(轉自網路,特此說明)。 JavaScript複製代碼 <script
Time of Update: 2018-12-08
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
Time of Update: 2018-12-08
body { font-size: 0.8em; color: navy; } 上面的意思是為body選取器設定font-size字型大小和color字型顏色。 所以基本的,當它作用與HTML頁面時,在body標籤(整個視窗中的內容)之間的文字顏色是navy字型大小是0.8ems。 長度和百分比 CSS裡面有許多屬性值要指定單位,但有些基本單位被使用在一些屬性上,在這之前值得屬性下它們。
Time of Update: 2018-12-08
1、十六進位的顏色值對位元與大小寫 編寫十六進位顏色值時你可能會用小寫字母或省略成3位元,關於這寫法沒找到確實的資料證明對瀏覽器的渲染效率是否有影響,但十六進位的顏色值預設標準是大寫及6位元標註。在未知情況下不希望冒險而降低了渲染的效率。 * 不贊成 - color:#f3a; * 建議用 - color:#FF33AA; 2、display與visibility的差異
Time of Update: 2018-12-08
一、In-line 行內 行內樣式是在html標籤裡直接使用style屬性 <p style="color: red">text</p> 設定段落文字紅色。 但要記住,最後的HTML應該是獨立出來,使用表現文檔,所以行內樣式應該在任何地方避免。 二、Internal 內部 使用於整個頁面的植入內部樣式在head標籤裡面,style標籤包圍樣式。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Time of Update: 2018-12-08
xmlns="http://www.w3.org/1999/xhtml"> 時間2008-7-302008-7-302008-7-302008-7-302008-7-302008-7-302008-7-302008-7-302008-7-302008-7-30
Time of Update: 2018-12-08
<link id="system_style" type="text/css" href="global.css" rel="stylesheet"/> <div id="myArticle"> ... </div> 在global.css中聲明了 #myArticle{ width:400px; height:300px; } 這樣的情況下,直接通過JS進行getElementById('myArticle').style.width是無法擷取4
Time of Update: 2018-12-08
強制不換行 div{ white-space:nowrap; } 自動換行 div{ word-wrap: break-word; word-break: normal; } 強制英文單詞斷行 div{ word-break:break-all; } CSS設定不轉行: overflow:hidden 隱藏 white-space:normal 預設 pre 換行和其他空白字元都將受到保護 nowrap 強制在同一行內顯示所有文本,直到文本結束或者遭遇 br 對象 設定強行換行:
Time of Update: 2018-12-08
Selector:first-letter {font-size:2.5em; font-family:"楷體_GB2312"; font-weight:bold; line-height:1.2em; float:left; padding:5px 2px 0 0; color:#c00;} 如果你覺得還不是很清楚,那麼這裡就細細講述一下: 首先要在HTML中有一段自己的文本,是在<p></p>中的也好,在其它塊標籤中都可以。給他個ID也好,class也好,
Time of Update: 2018-12-08
例如寬度為210px的ul裡 分別有4個li 這個4個li的寬度根據它們的自身內容長度為80px、120px、140px、80px。 我需要的效果是4個li向左自動排文。當第三個li和前兩個li的長度之和大於ul的寬度時候 第三個li則會下移一行。在第二行顯示。而不是把ul撐寬,或者是把自己撐高(內容換行,高度增加) 分別定義了ul的寬度210px和li的寬度自動,發現結果是:
Time of Update: 2018-12-08
今天看了振之關於有序列表的一篇文章,覺得挺不錯的。寫個例子:類型值 產生樣式 序列舉例 A 大寫字母 A、B、C、D、E a 小寫字母 a、b、c、c、e I 大寫羅馬數字 I、II、III、IV、V i 小寫羅馬數字 i、ii、iii、iv、v 1 阿拉伯數字 1、2、3、4、5 xmlns="http://www.w3.org/1999/xhtml"> 第一名第二名第三名第四名第五名第六名第七名第八名第九名第十名
Time of Update: 2018-12-08
例如: <div style="background:#666;"> <!-- float container --> <div style="float:left; width:30%; height:40px;background:#EEE; ">Some Content</div> </div> 此時預覽此代碼,我們會發現最外層的父元素float container,
Time of Update: 2018-12-08
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" c> <title>css把超出的部分顯示為省略符號的方法相容Firefox_指令碼之家_www.jb51.net</title>