css嵌入到html中的方法有哪些

這篇文章將為大家詳細講解有關css嵌入到html中的方法有哪些,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。

隴川網站建設公司成都創(chuàng)新互聯(lián)公司,隴川網站設計制作,有大型網站制作公司豐富經驗。已為隴川上千余家提供企業(yè)網站建設服務。企業(yè)網站搭建\成都外貿網站建設要多少錢,請找那個售后服務好的隴川做網站的公司定做!

將CSS樣式怎么嵌入html中的主要方法有三種:

1、設置標簽的style=""屬性,稱為內聯(lián)樣式;

2、在HTML的<head>標簽中使用<style>標簽,稱為嵌入式樣式;

3、創(chuàng)建并鏈接外部CSS文件,稱為外部樣式表。

基本樣式表通常修改html標記的外觀,如<body>和<p>。在頭文件中使用CSS文件或樣式表時,我們還可以定義樣式類,并使用class="?"屬性將它們應用于任何元素,但這超出了本簡單指南的范圍。

內聯(lián)樣式

特點:

1)、內聯(lián)樣式放在代碼中的HTML元素中。

2)、使用內聯(lián)樣式時,樣式只會影響你選擇的元素。

3)、內聯(lián)樣式沒有選擇器

注:HTML中定義的內聯(lián)樣式只適用于它們添加到的標記。

<p style="color:red;">Some red text</p>

優(yōu)點:

1、如果您想測試和預覽更改,則非常有用。

2、對快速修復很有用。

3、降低HTTP請求。

缺點:

內聯(lián)CSS必須應用于每個元素。

嵌入式樣式

特點:

1)、被放置在樣式標簽<style type ="text / css"> </ style>編寫的網頁的頭部部分中。

2)、編寫的樣式將僅用于您使用它的網頁。

3)、嵌入樣式也稱為“內部樣式”

標題中定義的樣式將應用于整個頁面。下面的示例將使頁面中的所有h2標記都以紅色顯示標題。

<head>
   <style type="text/css"> 
       h2 { color: red; }
   </style>
</head>

優(yōu)點:

1、樣式表只影響一個頁面。

2、內部樣式表可以使用類和ID。

3、無需上傳多個文件。HTML和CSS可以在同一個文件中。

缺點:

1、增加頁面加載時間。

2、它只影響一個頁面 - 如果要在多個文檔上使用相同的CSS,則無用。

外部樣式表

與HTML文件一樣,CSS文件也是純文本,并且通常具有.css文件擴展名;可以通過特定的標簽來將其鏈接到HTML文件中。

特點:

1)、在單獨的文檔中編寫然后附加到各種Web文檔中

2)、修改它可以影響所有你所調用的頁面

3)、便于修改操作

例如,style.css文件內容可以如下所示:

body { background-color: beige; color: #000080;}
h2 { color: red;}

然后可以使用<link…>在header頭中引入生效。

<head>
<link rel="stylesheet" type="text/css" href="style.css" title="style">
</head>

優(yōu)點:

1、HTML頁面的大小更小,結構更清晰。

2、加載速度更快。

3、相同的.css文件可以在多個頁面上使用。

缺點:

在加載外部CSS之前,頁面可能無法正確呈現。

關于css嵌入到html中的方法有哪些就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。

分享標題:css嵌入到html中的方法有哪些
文章轉載:http://muchs.cn/article6/iidiog.html

成都網站建設公司_創(chuàng)新互聯(lián),為您提供服務器托管、用戶體驗、小程序開發(fā)品牌網站建設、外貿網站建設網站改版

廣告

聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

成都app開發(fā)公司