成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

Web前端基礎(chǔ)知識整理-CSS篇

邱勇 / 1344人閱讀

摘要：標(biāo)簽標(biāo)簽自定義盒模型一基本概念盒模型由里向外是由構(gòu)成的。生成相對定位的元素，相對于其正常位置進(jìn)行定位。相對與支付的高度，通常為字體高度的一半。視口被平均分為單位的相對于視口的高度。

CSS手冊：http://t.mb5u.com/css3/
選擇器
一、元素選擇符

通配選擇符(*):選擇所有元素

類型選擇符(E)：以文檔對象類型作為選擇符

id選擇符(E#id):以唯一標(biāo)識符id屬性等于id的E對象作為選擇符

class選擇符(E.class):以class屬性包含class的E對象作為選擇符

二、關(guān)系選擇符

包含選擇符(E F):選擇所有被E元素包含的F元素

子選擇符(E>F):選擇所有作為E元素的子元素F。

相鄰選擇符(E+F):選擇緊貼再E元素之后F元素。

兄弟選擇符(E~F):選擇E元素后面的所有兄弟元素F。

三、屬性選擇符

四、偽類選擇符

五、偽對象選擇符

優(yōu)先級：
標(biāo)簽選擇符、偽類與偽對象：權(quán)重為1。
類選擇符、屬性選擇符：權(quán)重為10。
ID選擇符：權(quán)重為100。
內(nèi)聯(lián)style屬性：權(quán)重為1000。
!important：權(quán)重為無窮。

p

盒模型
一、基本概念：盒模型由里向外是由：content、padding、border、margin構(gòu)成的。
二、類型：標(biāo)準(zhǔn)盒模型、IE模型

標(biāo)準(zhǔn)盒模型：width=content

          height=content

IE盒模型：width=content+padding+border

        height=content+padding+border

三、CSS設(shè)置兩種模型

/* 標(biāo)準(zhǔn)模型 */
box-sizing:content-box;

 /*IE模型*/
box-sizing:border-box;

定位
一、定位position分類

static默認(rèn)值，沒有定位，元素出現(xiàn)在正常的流中。

absolute：生成絕對定位的元素，相對于 static 定位以外的第一個父元素進(jìn)行定位。

relative：生成相對定位的元素，相對于其正常位置進(jìn)行定位。

fixed：生成絕對定位的元素，相對于瀏覽器窗口進(jìn)行定位。

inherit：規(guī)定應(yīng)該從父元素繼承 position 屬性的值。

尺寸單位
一、文本相對長度單位

em（CSS1）：相對于當(dāng)前對象內(nèi)文本的字體尺寸

如果body的font-size：設(shè)置為14px，那么1em = 14px

ex（CSS1）：相對長度單位。相對與支付"x"的高度，通常為字體高度的一半。

ch（CSS3）：相對與數(shù)字“0”的寬度

rem（CSS3）：相對于根元素（html元素）font-size的計算倍數(shù)
如果html的font-szie：設(shè)置為14px，那么1rem = 14px

二、視口相對長度單位

vw（CSS3）：相對于視口的寬度。視口被平均分為100單位的vw

vh（CSS3）: 相對于視口的高度。視口被平均分為100單位的vh

vm（CSS3）: 相對于視口的寬度或高度。對于視口的寬度或高度，總是相對于小的那個。視口的寬度或高度被均分為100單位的vm

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/113268.html

相關(guān)文章

  • 前端開發(fā)-從入門到Offer - 收藏集 - 掘金

    摘要：一些知識點有哪些方法方法前端從入門菜鳥到實踐老司機(jī)所需要的資料與指南合集前端掘金前端從入門菜鳥到實踐老司機(jī)所需要的資料與指南合集歸屬于筆者的前端入門與最佳實踐。 工欲善其事必先利其器-前端實習(xí)簡歷篇 - 掘金 有幸認(rèn)識很多在大廠工作的學(xué)長，在春招正式開始前為我提供很多內(nèi)部推薦的機(jī)會，非常感謝他們對我的幫助?，F(xiàn)在就要去北京了，對第一份正式的實習(xí)工作也充滿期待，也希望把自己遇到的一些問題和...

    sf_wangchong 評論0 收藏0

  • 前端文檔收集

    摘要：系列種優(yōu)化頁面加載速度的方法隨筆分類中個最重要的技術(shù)點常用整理網(wǎng)頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數(shù)組函數(shù)數(shù)據(jù)訪問性能優(yōu)化方案實現(xiàn)的大排序算法一怪對象常用方法函數(shù)收集數(shù)組的操作面向?qū)ο蠛驮屠^承中關(guān)鍵詞的優(yōu)雅解釋淺談系列 H5系列 10種優(yōu)化頁面加載速度的方法 隨筆分類 - HTML5 HTML5中40個最重要的技術(shù)點 常用meta整理 網(wǎng)頁性能管理詳解 HTML5 ...

    jsbintask 評論0 收藏0

  • 前端文檔收集

    摘要：系列種優(yōu)化頁面加載速度的方法隨筆分類中個最重要的技術(shù)點常用整理網(wǎng)頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數(shù)組函數(shù)數(shù)據(jù)訪問性能優(yōu)化方案實現(xiàn)的大排序算法一怪對象常用方法函數(shù)收集數(shù)組的操作面向?qū)ο蠛驮屠^承中關(guān)鍵詞的優(yōu)雅解釋淺談系列 H5系列 10種優(yōu)化頁面加載速度的方法 隨筆分類 - HTML5 HTML5中40個最重要的技術(shù)點 常用meta整理 網(wǎng)頁性能管理詳解 HTML5 ...

    muddyway 評論0 收藏0

  • 【連載】前端個人文章整理-從基礎(chǔ)到入門

    摘要：個人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現(xiàn)在已經(jīng)一年的時間了，由于工作比較忙，更新緩慢，后面還是會繼更新，現(xiàn)將已經(jīng)寫好的文章整理一個目錄，方便更多的小伙伴去學(xué)習(xí)。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個人前端文章整理 從最開始萌生寫文章的想法，到著手...

    madthumb 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<