小白也能看懂的css基礎(三)

2021-10-24 18:28:10 字數 2243 閱讀 1271

接上文----css基礎(二)

解決方法:

對img設定display:block;

調整vertical-align:取值 top | middle | bottom;

結合實際來選擇解決方法

ie相容問題

ie8以下瀏覽器背景復合屬性寫法問題

.bg

url和no-repeat之間沒有空格,在ie8以下顯示異常。

ie6和ie7相容問題(忽略)

雙倍margin /

1 條件hack 選擇ie瀏覽器以及不同版本

ie特有功能,ie10開始標準模式下,不再支援條件注釋

gt大於 lt小於 gte大於等於 lte小於等於 !非

2 屬性級hack (了解)

可能在樣式屬性名前面或者值的後面加上一些只有特定瀏覽器能識別的hack字首或字尾

_ 下劃線 選擇ie6或以下 如 _color: red

*ie6/7識別

3 選擇符級hack

對ie6生效
1  opacity: number   (0-1)   

相容性 :ie9及以上和標準瀏覽器都支援

特點:設定opacity的元素的所有後代會一起具有透明性

2 rgba(255, 255, 255,.3)

相容性: ie9及以上和標準瀏覽器都支援

使用 設定顏色的不透明度,用於調整color,bgc等

3 ie專屬濾鏡

filter: alpha(opacity=x)

相容性 :ie6-9 ie10開始廢除

備註:為了相容性,一三同時寫

css sprite  css精靈/css雪碧

把網頁中一些小的背景圖整合到乙個大檔案圖中,應用background-image,background-repeat,background-position組合進行背景定位,適用於小圖示。

缺點: 必須限定容器的大小,符合背景圖元素位置。

推介切圖軟體:fscapture切圖, 藍湖, 摹客

pc端專案規範

1 檔案管理

檔名:有意義的英文命名

html + css(reset . css重置樣式) + imgs + js + psd

* html:index.html 首頁

*css:reset.css 重置瀏覽器樣式 public . css 公共樣式(頁面頭部尾部或其他重複樣式,字型字型大小等) index . css 首頁樣式

*upload 上傳

2 html 書寫規範

*h5模板

***書寫規範 :縮排 ,命名 ,屬性值用雙引號引起來 ,標籤要閉合 ,語義化 ,選擇合適標籤 ,合理巢狀標籤 ,使用者體驗 ,

*保證結構樣式相分離 ,盡量避免用行內樣式

3 css書寫規範

*utf-8

*版心 1100/1200px

* body 字型 a a:hover li

*書寫**時,新增注釋, 常用css命名

*(css書寫順序)

布局定位屬性-->自身屬性-->文字屬性-->其他屬性

*相容性:

補充 css屬性:

1、**細線邊框

border-collapse:collapse;

2、滑鼠形狀:

cursor:default(預設箭頭) | pointer(手指)| auto(瀏覽器預設設定游標) | crosshair(十字)| move (拖拽)

3、字間距:

letter-spacing:1px;

詞間距:以空格解析為依據

word-sapce: 1px;

4、隱藏顯示

display:none; 隱藏(不佔空間)

visibility:hidden;隱藏(佔空間)| visible(預設可見)

outline:none;輪廓邊框,用法同border, input搭配使用

border:0 | none;去除邊框

小白也能看懂的css基礎(一)

2 選擇器 3 常用的屬性 3.4 背景background 3.5 標籤顯示模式 display 一般少用,不推薦 backgroung color blue 在head標籤內放置,樣式不多時使用 新建檔案寫css樣式,在head內寫link引入html。標籤選擇器 標籤名 id選擇器 id名 i...

小白也能看懂的XML簡介

目錄 一.xml簡介 二 xml用途 三 xml結構 四 xml語法 五 xml元素 六 xml屬性 七 總結 1.xml指可擴充套件標記語言,很類似html。xml被設計為傳輸和儲存資料,其焦點是資料的內容 html被設計用來顯示資料,其焦點是資料的外觀。2.xml的設計宗旨是傳輸資料,而非顯示資...

小白也能看懂的Cookie跟Session的區別

首先為了能充分理解為什麼引入cookie和cookie是什麼,先看了例子。不然官網上定義的概念不太容易看懂。eg 我今天想找老王吃放,打 給老王 例子看完了,在看看一些官網上一些專業術語的定義。會話 由一組請求和響應組成 理解為上面例子中的 對話 是圍繞著一件相關事情 吃飯 所進行的請求和響應。這些...