• <abbr id="qqgmy"></abbr>
      <menu id="qqgmy"><abbr id="qqgmy"></abbr></menu>
    • <rt id="qqgmy"><code id="qqgmy"></code></rt>
      • 網(wǎng)頁(yè)設(shè)計(jì)時(shí)的CSS基本用法

        • 2019-07-17 13:25:12
        • 閱讀次數(shù):
        • 作者:盈嵐科技小編
        • 來(lái)源:http://www.margaycoffee.com

        CSS樣式代碼在網(wǎng)頁(yè)設(shè)計(jì)時(shí)必須保存在.css類(lèi)型的文本文件中,或者放在網(wǎng)頁(yè)內(nèi)<style>標(biāo)簽中,或者在網(wǎng)頁(yè)設(shè)計(jì)時(shí)插在網(wǎng)頁(yè)標(biāo)簽的style屬性值中,否則是無(wú)效的,瀏覽器會(huì)視其如普通的字符串,而不對(duì)其進(jìn)行解析。詳細(xì)說(shuō)明如下:   

        ?直接放在標(biāo)簽的style屬性中。

        【示例1】在下面代碼中,直接使用style屬性為標(biāo)簽定義樣式。

        <span style="color:red;">紅色字體</span>

        <div style="border:solid 1px blue; 

        width:200px; height:200px;"></div>

        這樣當(dāng)瀏覽器解析這些標(biāo)簽時(shí),檢測(cè)到該標(biāo)簽包含有style屬性,于是就調(diào)用CSS引擎來(lái)解析這些樣式碼,并把效果呈現(xiàn)出來(lái)。這種通過(guò)style屬性直接把樣式碼放在標(biāo)簽內(nèi)的做法被稱(chēng)之為行內(nèi)樣式,因?yàn)樗c傳統(tǒng)網(wǎng)頁(yè)布局中在標(biāo)簽增加屬性的設(shè)計(jì)方法沒(méi)有什么兩樣,這種方法實(shí)際上還沒(méi)有真正把HTML結(jié)構(gòu)和CSS表現(xiàn)分開(kāi)進(jìn)行設(shè)計(jì),因此不建議使用。除非為頁(yè)面中個(gè)別元素設(shè)置某個(gè)特定樣式效果而單獨(dú)進(jìn)行定義。   

        ?把樣式代碼放在<style>標(biāo)簽內(nèi)。

        【示例2】在下面代碼中,把樣式代碼放置在<style>標(biāo)簽內(nèi)。

        <style type="text/css">body {/*頁(yè)面基本屬性*/    

        font-size: 12px;    

        color: #CCCCCC;}

        /*段落文本基礎(chǔ)屬性*/

        p { background-color: #FF00FF; }

        </style>

        網(wǎng)頁(yè)設(shè)計(jì)時(shí)設(shè)置<style>時(shí)應(yīng)該指定type屬性,告訴瀏覽器該標(biāo)簽包含的代碼是CSS源代碼。

        這樣當(dāng)瀏覽器解析<style>標(biāo)簽所包含的代碼時(shí),會(huì)自動(dòng)調(diào)用CSS引擎進(jìn)行解析。這種CSS應(yīng)用方式也被稱(chēng)為網(wǎng)頁(yè)內(nèi)部樣式。如果僅為一個(gè)頁(yè)面定義CSS樣式時(shí),使用這種方法比較高效,且管理方便。但是在一個(gè)網(wǎng)站中,或多個(gè)頁(yè)面之間引用時(shí),使用這種方法會(huì)產(chǎn)生代碼冗余,不建議使用,而且一頁(yè)頁(yè)管理樣式也是不經(jīng)濟(jì)的。

        內(nèi)部樣式一般放在網(wǎng)頁(yè)的頭部區(qū)域,目的是讓CSS源代碼早于頁(yè)面源代碼下載并被解析,這樣避免當(dāng)網(wǎng)頁(yè)信息下載之后,由于沒(méi)有CSS樣式渲染而使頁(yè)面信息無(wú)法正常顯示。   

        ?保存在.css類(lèi)型的文件中。

        把樣式代碼保存在單獨(dú)的.css類(lèi)型文件中,然后使用<link>標(biāo)簽或者@import關(guān)鍵字導(dǎo)入。這樣當(dāng)瀏覽器遇到這些代碼時(shí),會(huì)自動(dòng)根據(jù)它們提供的URL把外部樣式表文件導(dǎo)入到頁(yè)面中并進(jìn)行解析。關(guān)于這個(gè)話題將在之后詳細(xì)分析。這種應(yīng)用樣式的方式也被稱(chēng)為外部樣式。一般網(wǎng)站都采用外部樣式來(lái)設(shè)計(jì)網(wǎng)站的表現(xiàn)層問(wèn)題,以便統(tǒng)籌設(shè)計(jì)CSS樣式,并能夠快速開(kāi)發(fā)和高效管理。

        當(dāng)前文章標(biāo)題:網(wǎng)頁(yè)設(shè)計(jì)時(shí)的CSS基本用法

        當(dāng)前URL:http://www.margaycoffee.com/news/wzzz/3054.html

        上一篇:網(wǎng)站建設(shè)中的CSS基礎(chǔ)

        下一篇:網(wǎng)頁(yè)設(shè)計(jì)中的CSS樣式表

        網(wǎng)站建設(shè)、網(wǎng)絡(luò)營(yíng)銷(xiāo)咨詢專(zhuān)線:181-8386-5875(點(diǎn)擊可一鍵撥號(hào))
        在线一区视频二区三区,av无码久久久不卡网站,亚洲国产人成精品,国产成人白丝视频
        • <abbr id="qqgmy"></abbr>
          <menu id="qqgmy"><abbr id="qqgmy"></abbr></menu>
        • <rt id="qqgmy"><code id="qqgmy"></code></rt>