您現在的位置是:電腦技術吧?>? 故障問題 ??>??簡寫,7月簡寫??>??正文詳情

簡寫,7月簡寫

進瓊音2019-11-26 11:41:27 人圍觀
簡介6月英語簡寫CSS速記是指將多行CSS屬性速記成一行,也稱為CSS代碼優化或CSS縮寫。CSS速記的最大優點是它可以顯著減小CSS文件的大小,優化網站的整體性能,并使其更易左右英文簡寫

CSS簡寫就是指將多行的CSS屬性簡寫成一行,又稱為CSS代碼優化或CSS縮寫。

CSS簡寫的最大好處就是能夠顯著減少CSS文件的大小,優化網站整體性能,更加容易閱讀。

  下面介紹常見的CSS簡寫規則:  一、盒子大小  這里主要用于兩個屬性:margin和padding,我們以margin為例,padding與之相同。

盒子有上下左右四個方向,每個方向都有個外邊距:  margin-top:1px;  margin-right:2px;  margin-bottom:3px;  margin-left:4px;  你可以簡寫成:  margin:1px 2px 3px 4px;  語法 margin:top right bottom left;  //四個方向的邊距相同,等同于margin:1px 1px 1px 1px;  margin:1px;  //上下邊距都為1px,左右邊距均為2px,等同于margin:1px 2px 1px 2px;  margin:1px 2px;  //右邊距和左邊距相同,等同于margin:1px 2px 3px 2px;  margin:1px 2px 3px;  //注意,這里雖然上下邊距都為1px,但是這里不能縮寫。

  margin:1px 2px 1px 3px;  二、邊框(border)  邊框的屬性如下:  border-width:1px;  border-style:solid;  border-color:#000;  可以縮寫為一句:  border:1px solid #000;  語法 border:width style color;  三、背景(Backgrounds)  背景的屬性如下:  background-color:#f00;  background-image:url(background.gif);  background-repeat:no-repeat;  background-attachment:fixed;  background-po sition:00;  可以縮寫為一句:  background:#f00 url(background.gif) no-repeat fixed 0 0;  語法是background:color image repeat attachment po sition;  你可以省略其中一個或多個屬性值,如果省略,該屬性值將用瀏覽器默認值,默認值為:  color: transparent  image: none  repeat: repeat  attachment: scroll  po sition: 0% 0%  四、字體(fonts)  字體的屬性如下:  font-style:italic;  font-variant:small-caps;  font-weight:bold;font-size:1em;  line-height:140%;  font-family:Lucida Grande,sans-serif;  可以縮寫為一句:  font:italic small-caps bold 1em/140%Lucida Grande,sans-serif;  注意,如果你縮寫字體定義,至少要定義font-size和font-family兩個值。

  五、列表(lists)  取消默認的圓點和序號可以這樣寫list-style:none;,  list的屬性如下:  list-style-type:square;  list-style-po sition:inside;  list-style-image:url(image.gif);  可以縮寫為一句:  list-style:square inside url(image.gif);  六、顏色(Color)  16進制的色彩值,如果每兩位的值相同,可以縮寫一半。

例如:  Aqua: #00ffff #0ff  Black: #000000 #000  Blue: #0000ff #00f  Dark Grey: #666666 #666  Fuchsia:#ff00ff #f0f  Light Grey: #cccccc #ccc  Lime: #00ff00 #0f0  Orange: #ff6600 #f60  Red: #ff0000 #f00  White: #ffffff #fff  Yellow: #ffff00 #ff0  七、屬性值為0  書寫原則是如果CSS屬性值為0,那么你不必為其添加單位(如:px/em),你可能會這樣寫:  padding:10px 5px 0px 0px;  試試這樣吧:  padding:10px 5px 00 ;  八、最后一個分號  最后一個屬性值后面分號可以不寫,如:  #nav{  border-top:4px solid #333;  font-style: normal;  font-variant:normal;  font-weight: normal;  }  可以簡寫成:  #nav{  border-top:4px solid #333;  font-style: normal;  font-variant:normal;  font-weight: normal  }  九、字體粗細(font-weight)  你可能會這樣寫:  h1{  font-weight:bold;  }  p{  font-weight:normal;  }  可以簡寫成:  h1{  font-weight:700;  }  p{  font-weight:400;  }  十、圓角半徑(border-radius)  border-radius是css3中新加入的屬性,用來實現圓角邊框。

  -moz-border-radius-bottomleft:6px;  -moz-border-radius-topleft:6px;  -moz-border-radius-topright:6px;  -webkit-border-bottom-left-radius:6px;  -webkit-border-top-left-radius:6px;  -webkit-border-top-right-radius:6px;  border-bottom-left-radius:6px;  border-top-left-radius:6px;  border-top-right-radius:6px;  可以簡寫成:  -moz-border-radius:0 6px 6px;  -webkit-border-radius:0 6px 6px;  border-radius:0 6px 6px;  語法 border-radius:topleft topright bottomright bottomleft

版權聲明:本文由 進瓊音 整理編輯。

原標題:二十簡寫,星期簡寫

轉載注明出處:http://www.dn9ww09s.icu/fault/14439.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • Win10安全模式,win安全模式

    Win10安全模式,win安全模式 相關圖片win安全模式怎么進安全模式是Windows操作系統中的一種特殊模式。其工作原理是在不加載第三方設備驅動程序的情況下啟動計算機,使計算機以系統的最小模式運行,使用戶能夠方便地檢...

  • 可以導入本地書籍的讀書軟件,微信讀書可以導入本地書籍嗎

    可以導入本地書籍的讀書軟件,微信讀書可以導入本地書籍嗎 相關圖片書源導入起點閱讀應用不僅可以讓用戶閱讀起點以上的海量優質文章,還可以讓用戶將本地圖書導入起點閱讀進行閱讀。那么,如何從起點閱讀引進本土圖書呢?今天,超人編輯將為您...

  • html虛線分割線,dw怎么做圖文混排

    html虛線分割線,dw怎么做圖文混排 相關圖片dreamweaver怎么用打開你網站的主頁,我是index.html,在這里找到菜單欄上的修改,點擊如下圖所示,然后點擊頁面屬性,用鼠標點擊頁面屬性中的外觀-----瀏覽并打開頁面,找到dreamweaver可...

  • 拼多多怎么看買家信息,拼多多買家賬號哪里看

    拼多多怎么看買家信息,拼多多買家賬號哪里看 相關圖片拼多多怎么看賣家是哪里的當我們在網上購買商品時,查看評論是非常重要的。我們可以通過評論來判斷商店的東西是否與描述相符,生意是否誠實等等。平多多怎么看不到買家的評價...

  • html cookie,html使用cookie

    html cookie,html使用cookie 相關圖片js使用cookie背景讓我們先來看看各種本地存儲的變化:cookies:瀏覽器支持,容量為4kbuserdata:only supported by ie,容量為64kbflasjs怎么使用cookie...

  • 怎么做ppt母版詳細步驟,ppt怎么生成母版

    怎么做ppt母版詳細步驟,ppt怎么生成母版 相關圖片如何運用幻燈片母版Ppt一直是辦公軟件中一種流行的辦公軟件。當然,PPT的使用率極高。了解一些PPT使用技巧可以幫助我們提高工作效率。所以今天,超人編輯將介紹如何讓ppt掌握PP如何...

  • 滬江開心詞場如何破解,滬江開心詞場怎么賺滬元

    滬江開心詞場如何破解,滬江開心詞場怎么賺滬元 相關圖片滬江開心詞場不要拼寫題最近,湖江快樂詞壇有很多用戶不知道如何登錄。所以今天,超人軟件編輯想在湖江快樂詞壇的課程中介紹一下iPhone的招牌,希望對大家有所幫助!湖江快樂詞...

  • 一帶一路的認識,談談你如何認識一帶路戰略

    一帶一路的認識,談談你如何認識一帶路戰略 相關圖片剛認識了解HTML5的websocket。在HTML5規范中,我最喜歡的web技術是websocket API,它正在迅速流行起來。Websocket提供了一種流行的認識...

  • 乖巧 表情包,乖巧三連表情包

    乖巧 表情包,乖巧三連表情包 相關圖片哼表情包你厭倦了看你每天使用的表情包嗎?超人小編是一個沒有表情包的小高手,聊天的時候感覺很空虛,今天我將分享一組可愛的表情包高清圖片下載和跪下智能表情包嘻嘻表情包...

  • 晶瑩剔透還是晶瑩剔透,晶瑩剔透的露珠

    晶瑩剔透還是晶瑩剔透,晶瑩剔透的露珠 相關圖片晶瑩剔透的水珠像什么在最終效果的第一步中,隨意創建一個新畫布,用﹐000066填充背景色,用鋼筆繪制基本形狀,羽毛邊框(半徑1),填充放射性梯度,并在濾光片外添加燈光。效果...

熱評文章

  • 怎么釋放電腦內存空間,如何清理電腦內存

    怎么釋放電腦內存空間,如何清理電腦內存 相關圖片如何深度清理電腦內存與手機一樣,電腦將使用越來越多的內存,運行速度也會越來越慢。今天,超人編輯介紹如何更好更快地清理電腦垃圾,增加電腦內存空間。讓我們來看看超人小...

  • 透明網頁,網頁能不能是透明的

    透明網頁,網頁能不能是透明的 相關圖片透明大頁面當我們在網頁中插入flash時,有時我們需要將其設置為透明,有時我們需要在flash的背面插入一些漂亮的圖片,并將它們與漂亮的效果相匹配。讓我們介紹一些將fla空間透明背...

  • 哈羅單車如何還車,單車怎么還車

    哈羅單車如何還車,單車怎么還車 相關圖片共享單車怎么還車步驟現在越來越多的人會用小明自行車來解決最后一公里的問題。那么小明自行車怎么能回來呢?接下來,超人軟件編輯將為您介紹iPhone版的小明自行車。讓我們看看...

  • 發光特效,發光的特效是什么軟件

    發光特效,發光的特效是什么軟件 相關圖片pr發光特效最終渲染:步驟1:繪制一個圓開始焰火-將背景設置為黑色并在畫布中繪制一個圓步驟2:在圖像圓內添加徑向漸變。梯度法選擇徑向,顏色填充值為××000000-××ffae物體發光特...

  • 怎么將html轉換為word,html怎么轉換成word

    怎么將html轉換為word,html怎么轉換成word 相關圖片word批量轉換html我以前教過你如何將PDF轉換成word、Excel或PPT今天的超人編輯想教你如何將word轉換成HTML。這不奇怪嗎?事實上,把word轉換成PDF并不難,不html生成word...

  • PDF轉換,PDF轉換器

    PDF轉換,PDF轉換器 相關圖片pdf轉換成jpg今天,這五個在線工件可以幫助您轉換PHP?/PDF/'target='[blank'>PDF轉換成word、PPT、Excel、JPG、xls等,反之亦然。這是excel轉換pdf...

  • 650ti顯卡和750差多少,gtx750 ti顯卡怎么樣

    650ti顯卡和750差多少,gtx750 ti顯卡怎么樣 相關圖片gtx750和gtx650ti區別玩游戲的用戶非常關心顯卡。在眾多顯卡中,gtx750ti被眾多玩家選擇。Gtx750ti是NVIDIA推出的Maxwell體系結構圖形卡。采用28nm技術,材料索泰750ti怎么樣...

  • vertu ti多少錢,vertu為什么那么貴

    vertu ti多少錢,vertu為什么那么貴 相關圖片vertu手機好在哪Vertu ti是人們所說的緯度地圖的限量版手機。很多人只聽到它的名字,卻聽不到它的機器。Vertu手機是諾基亞旗下的一個豪華手機品牌。它于2013年2月14日vertu手機為何貴...

  • python數組賦值,python數組排序

    python數組賦值,python數組排序 相關圖片python定義空數組本文主要介紹了用Python標準算法實現數組全排列的方法,并結合實例分析了全排列的原理和Python實現技巧。可以參考下面的示例來描述使用Python標準算法實python數組長度...

  • 小鳴單車申報完怎么拿退押金,小鳴單車退押金12315

    小鳴單車申報完怎么拿退押金,小鳴單車退押金12315 相關圖片小鳴單車押金什么時候還我相信有很多小朋友都在用小明自行車,所以當他們不想騎的時候,小明自行車怎么能退押金呢?今天,超人軟件編輯將為大家介紹小明自行車iPhone版的退押金...

關注微信

变脸官网查询