原创 前端編程-如何糾錯-學習筆記

如何糾錯設置背景法                 找出相應盒子的區域,通過區域來判斷問題的起因,比如“父級元素的高度自適應問題” 逐步刪除法               在“設置背景”仍無法解決找出問題原因的情況下,可將頁面“另存爲”一

原创 IE6雙倍邊距bug

IE6雙倍邊距bug出現條件: 1.首先是塊元素,內聯元素不會出現此bug------所以以毒攻毒,使用display;inline;來講此元素變爲內聯元素消除此bug 2.有浮動,脫離文本流 3.有外邊距

原创 XHTML+CSS 文字加粗的方式[學習筆記]

font-weight:700;相當於font-weight:bold;數字比英文解析更快,建議寫700;strong標籤加粗h1~h6標題標籤加粗

原创 CSS Hack解決兩個陣營:①IE8、IE9②IE6、IE7、FireFox

margin-left:10px;    FireFox margin-left:10px\9;    區分出IE和FireFox *margin-left:10px;      IE6、IE7

原创 萬能兼容所有瀏覽器導航條-學習筆記

兼容所有瀏覽器的萬能瀏覽器,很多漂亮的導航基本都是由此導航條演化而來,多多練習幾遍。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <titl

原创 CSS2.0下1行2列,左側固定右側自適應佈局,兼容所有瀏覽器。[學習筆記]

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>1行2列-左固右自適應</title> <style type="text/css">

原创 標籤重置 CSS Reset--學習筆記

Questions: 爲什麼要重置標籤?爲了增強頁面的兼容性,讓更多的瀏覽器顯示的效果一致;因爲不同的瀏覽器都有一套內置的CSS樣式表,目的是爲了正常顯示不具有樣式表的頁面;提高我們製作的頁面兼容瀏覽器的性能。最普通的CSS Reset 

原创 position定位知識點彙總

如果想將某個元素定位到頁面某處的話,此元素position設置absolute,外面盒子position設置relative。 position:absolute;初始默認絕對定位於瀏覽器,如果想絕對定位於外面某盒子元素,則給改盒子元素添

原创 清除浮動-解決父級元素高度不能適應子級元素高度的問題

說明:如果一個web前端開發工程師在佈局頁面的時候只要思路沒問題,清除浮動是用不到的,誰用了清除浮動,就說明誰在佈局頁面時的思路有問題,對浮動並沒有完全理解。 IE6下滾動條bug IE6裏面子元素會自動撐大父元素, overflow:h

原创 overflow、overflow-x、overflow-y初識

一、overflow overflow 屬性規定當前內容溢出元素框時會如何處理。 支持情況:所有瀏覽器都支持overflow屬性。 序號 overflow的值 描述 1 visible 默認值,內容不會被修剪,會呈現在元素框之外。沒有滾

原创 提升網頁價值-學習筆記

網頁的價值是什麼?代碼少,結構清晰頁面加載速度更快帶寬要求降低(代碼更簡潔),成本降低更利於搜索引擎的抓取 更好的兼容性和擴展性被更多的用戶所訪問(包括失明、視弱、色盲等殘障人士)被更廣泛的設備所訪問(包括屏幕閱讀機、手持設備)頁面靈活性

原创 使用CSS Hack解決IE6雙倍邊距Bug

使用CSS Hack解決IE6雙倍邊距Bug IE6雙倍邊距Bug產生條件:浮動、外邊距、塊元素(同時) ps:最好的方法display:inline; <!DOCTYPE html>**重點內容** <html lang="en">

原创 CSS Hack 學習筆記

CSS Hack是解決頁面不能很好兼容多種瀏覽器的技巧方法。是個人對CSS代碼非官方的修改不能通過W3C的驗證常用的CSS Hack “\9” 所有IE均可識別,FireFox不能“*”  IE6、IE7

原创 display與visibility的區別

display:none 隱藏對應的元素,不佔據空間,它各邊的元素會合攏,就當這個元素不存在; visibility:hidden隱藏對應的元素,但是在文檔佈局中仍然保留原來的空間。

原创 [CSS3]touch-action

規定用戶能否以及如何操作頁面上的指定區域 注意:這是IE11的屬性,在IE10應使用-ms-touch-action,IE10之前的瀏覽器不支持 語法 touch-acion: auto | none | [ [ [ pan-x |