選擇器
舉例及性質
樣式類名選擇器
.***x 具有普遍性、通用性
id選擇器
#***x 具有唯一性,前提是標籤得有指定id
標籤選擇器
div a input…
組合選擇器
.***x #***x /.***x input
偽類選擇器
略復合選擇器
略注:選擇器可以根據層級關係進行設定,也可以只作用於某一層級
響應式設計
性質核心
@media
前提適配移動端,增加乙個標籤+屬性即可實現
舉例@media mediatype and not only(media feature)
分類適用物件
screen
用於電腦、手機、平板的螢幕
印表機和列印預覽
speech
螢幕閱讀器
all用於所有的裝置
舉例height/width
max-height/max-width
min-height/min-width
device-height/device-width
color/max-color/min-color
max-device-height/max-device-width
min-device-height/min-device-width
常見布局細化h
分欄式 1:1 1:2:1
工頭 內容 版權i略
i略t下拉無底
口無序列布局,自適應 100%
國登入介面 水平、垂直居中布局
框左右布局
注:布局心法:做布局時只考慮布局,做內容時只考慮內容
box-shadow
a b c d e f
a水平方向陰影 右+ 左-
b垂直方向陰影 下+ 上-
c模糊半徑 >0
d陰影的距離 >0
e陰影的顏色 rgba、rgb、#
f內陰影 inset /**影 ourset(預設)
CSS 網頁布局
一些布局 行布局 多列布局 聖杯布局 雙飛翼布局 會使用到 html和css基礎 會使用div css進行排版 熟悉 float屬性 position屬性。1 經典的行布局 基礎的行布局 行布局自適應 行布局自適應限制最大寬 行布局垂直水平居中 container 水平與垂直居中 container...
CSS 網頁布局
頭部區域位於整個網頁的頂部,一般用於設定網頁的標題或者網頁的 logo 鏈結鏈結 鏈結 重置瀏覽器大小檢視效果。鏈結鏈結 鏈結學的不僅是技術,更學的不僅是技術,更是夢想!學的不僅是技術,更是夢想!學的不僅是技術,更是夢想!學的不僅是技術,更是學的不僅是技術,更是夢想 學的不僅是技術,更是夢想!學的不...
CSS網頁布局
本文作為個人筆記,內容大多從網上查閱 提到布局就不得不提一提標準文件流了 文件流指的是元素排版布局過程中,元素會自動從左往右,從上往下的流式排列。並最終窗體自上而下分成一行行,並在每行中從左至右的順序排放元素。標準流的微觀現像 1.空白摺疊現象 多個空格會被合併成乙個空格顯示到瀏覽器頁面中。img標...