国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

css引入頁面的三種方法

浠ラ箍 / 3488人閱讀

摘要：內(nèi)聯(lián)式直接在標簽上寫樣式頁面引入方法頁面引入方法如上面的代碼所示，在標簽內(nèi)直接通過屬性直接寫樣式。然后通過標簽將樣式文件引入到頁面。這種方法才是開發(fā)中最常用的辦法。

1.內(nèi)聯(lián)式：直接在標簽上寫樣式

 1 DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>css頁面引入方法title>
 6 head>
 7 <body>
 8     <div style="color: red ;font-size:50px">css頁面引入方法div>
 9 body>
10 html>

　　如上面的代碼所示，在div標簽內(nèi)直接通過styl屬性直接寫樣式。那么這里我們設置了字體的顏色為紅色，字體大小為50px。

看一下顯示出來的效果。

　　　　這種方法在開發(fā)中是最不常用的一種，因為在標簽內(nèi)寫方法會讓代碼看起來很亂，而且也不利于管理和查找，所以只有在某些情況下才會使用這種方式來寫樣式。

2.嵌入式：通過style標簽來寫樣式

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css頁面引入方法title>
    <style type="text/css">
        div{
            color: green;
            font-size: 50px;
        }
    style>
head>
<body>
    <div>css頁面引入方法div>
body>
html>

　　可以看到我在head中用style標簽寫了一個樣式出來，通過選擇器選擇器來將樣式加入到頁面中。看一下效果。

　　　這種方法是比較常用的一種，一般在寫首頁的時候通常會用到這種方式，因為網(wǎng)站首頁加載快慢會直接影響用戶的體驗，所以網(wǎng)頁的加載速度就要快。那么這種方式不會影響加載速度，又將樣式整合到了標簽中，所以是比較適用的。但是也不會大量的使用。最后一種才是我們經(jīng)常用的方式。

3.外聯(lián)式：通過link標簽將樣式添加到頁面上

main.css

1 div{
2     font-size: 50px;
3     color: blue;
4 }

code.html

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css頁面引入方法title>
    <link rel="stylesheet" href="css/main.css">
head>
<body>
    <div>css頁面引入方法div>
body>
html>

　　我們可以看到這次用了兩個文件，一個是css文件，一個是html文件。css文件里寫的東西和style標簽中的寫法是一模一樣的。只是多帶帶寫在一個文件中。然后通過link標簽將css樣式文件引入到頁面。rel里面的東西我們不用管，herf中的路徑就是css文件的邏輯路徑。我們看一下效果。

　　這種方法才是開發(fā)中最常用的辦法。好處顯而易見，比如，低耦合，整潔，條理清晰。

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

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

相關(guān)文章

  • CSS的三種引入方式

    摘要：內(nèi)聯(lián)在元素中添加屬性添加樣式，只能作用于當前元素，不能復用。內(nèi)部在里面添加標簽可以當前頁面復用不能多頁面復用外部寫在單獨的文件里面通過標簽引入，可以多頁面復用內(nèi)聯(lián)優(yōu)先級最高內(nèi)部和外部優(yōu)先級一樣，后執(zhí)行的覆蓋前面執(zhí)行的內(nèi)聯(lián)： 在元素中添加style屬性添加樣式，只能作用于當前元素，不能復用。內(nèi)部：在head里面添加style標簽 可以當前頁面復用 不能多頁面復用 外部：寫在單獨的css文件里面...

    mrcode 評論0 收藏0

  • 圍住浮動元素的三種方法

    摘要：由于包含元素一定會包圍非浮動的子元素而且清除會讓這個子元素位于清除一側(cè)浮動元素的下方因此包含元素一定會包含這個子元素以及前面的浮動元素。 浮動元素脫離了文檔流,其父元素也看不到它了,因而也不會包圍它。這種情況有 時候并非我們想要的,下面向大家傳授三種圍住浮動子元素的方法。記住,這三種 方法你都得掌握,這樣才能審時度勢,選擇最合適的一種。 為了演示浮動元素的行為,這種行為對布局會產(chǎn)生...

    Bowman_han 評論0 收藏0

  • 前端（二）之 CSS

    摘要：前端之前端之前言前言昨天學習了標記式語言，也就是無邏輯語言。今天學習，被稱之為網(wǎng)頁的化妝師。為前端頁面的樣式，由選擇器作用域與樣式塊組成。年初，組織負責的工作組開始討論第一版中沒有涉及到的問題。其討論結(jié)果組成了年月出版的規(guī)范第二版。前端之 CSS 前言 昨天學習了標記式語言，也就是無邏輯語言。了解了網(wǎng)頁的骨架是什么構(gòu)成的，了解了常用標簽，兩個指令以及轉(zhuǎn)義字符；其中標簽可以分為兩大類： 一類...

    張率功 評論0 收藏0

  • 網(wǎng)站footer沉底效果的三種解決方案

    摘要：沉底效果重點代碼總結(jié)以上三種方法都屬于沒什么副作用的，其實實現(xiàn)這種沉底效果還有別的實現(xiàn)方式，但是對其他布局有影響，這里不贅述，之后有了更好的解決方案，再來更新。 問題背景 很多網(wǎng)站設計一般是兩個部分，content + footer，content里面裝的是網(wǎng)站主體內(nèi)容，footer里面展示網(wǎng)站的注冊信息等等，因為網(wǎng)站內(nèi)容高度不定的原因，會出現(xiàn)下面兩種情況：1.內(nèi)容較少時，這個foot...

    chanjarster 評論0 收藏0

  • 網(wǎng)站footer沉底效果的三種解決方案

    摘要：沉底效果重點代碼總結(jié)以上三種方法都屬于沒什么副作用的，其實實現(xiàn)這種沉底效果還有別的實現(xiàn)方式，但是對其他布局有影響，這里不贅述，之后有了更好的解決方案，再來更新。 問題背景 很多網(wǎng)站設計一般是兩個部分，content + footer，content里面裝的是網(wǎng)站主體內(nèi)容，footer里面展示網(wǎng)站的注冊信息等等，因為網(wǎng)站內(nèi)容高度不定的原因，會出現(xiàn)下面兩種情況：1.內(nèi)容較少時，這個foot...

    ?xiaoxiao, 評論0 收藏0

發(fā)表評論

0條評論

浠ラ箍

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<