這篇文章給大家分享的是有關(guān)html如何導(dǎo)入css文件的內(nèi)容。小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過來看看吧。
10年積累的成都網(wǎng)站建設(shè)、做網(wǎng)站經(jīng)驗(yàn),可以快速應(yīng)對(duì)客戶對(duì)網(wǎng)站的新想法和需求。提供各種問題對(duì)應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你,你也不認(rèn)識(shí)我。但先網(wǎng)站設(shè)計(jì)后付款的網(wǎng)站建設(shè)流程,更有萬載免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
方法:1、使用link標(biāo)簽,語法“<link rel="stylesheet" type="text/css" href="css文件路徑" >”;2、使用“@import”規(guī)則,語法“@import url("CSS文件路徑");”。
本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
CSS文件一般叫CSS外部樣式表,是用于放置CSS代碼的文本文件,而CSS代碼具有一定規(guī)律規(guī)則的文本代碼組成。我們使用記事本將擴(kuò)展名更改即可變成CSS文件。
css文件是以.css為后綴名的,我們看到以.css為后綴的文件就是css文件。
html怎么導(dǎo)入css文件
html中導(dǎo)入css文件的方法有兩種:
鏈接式(link)
導(dǎo)入式(@import)
css樣式文件--style.css代碼:
p{ font-size: 20px; color: #fff; background-color: palevioletred; }
1、鏈接式(link)
鏈接式會(huì)以網(wǎng)頁(yè)文件主體裝載前裝載CSS文件,因此顯示出來的網(wǎng)頁(yè)從一開始就是帶樣式的效果的,它不會(huì)象導(dǎo)入式那樣先顯示無樣式的網(wǎng)頁(yè),然后再顯示有樣式的網(wǎng)頁(yè),這是鏈接式的優(yōu)點(diǎn)。
語法:
<link rel="stylesheet" type="text/css" href="css文件的路徑" >
代碼實(shí)例:
HTML代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>鏈接式</title> <link rel="stylesheet" type="text/css" href="style.css" > </head> <body> <p>鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式鏈接式<p> </body> </html>
效果圖:
2、導(dǎo)入式(@import)
導(dǎo)入式會(huì)在整個(gè)網(wǎng)頁(yè)裝載完后再裝載CSS文件,因此這就導(dǎo)致了一個(gè)問題,如果網(wǎng)頁(yè)比較大則會(huì)兒出現(xiàn)先顯示無樣式的頁(yè)面,閃爍一下之后,再出現(xiàn)網(wǎng)頁(yè)的樣式。這是導(dǎo)入式固有的一個(gè)缺陷。
語法:
<style type="text/css" media="screen"> @import url("CSS文件路徑"); </style>
代碼實(shí)例:
HTML代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>導(dǎo)入式</title> <style type="text/css" media="screen"> @import url("style.css"); </style> </head> <body> <p>導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式導(dǎo)入式<p> </body> </html>
效果圖:
感謝各位的閱讀!關(guān)于“html如何導(dǎo)入css文件”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!
當(dāng)前標(biāo)題:html如何導(dǎo)入css文件
URL地址:http://chinadenli.net/article46/pijieg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站建設(shè)、營(yíng)銷型網(wǎng)站建設(shè)、做網(wǎng)站、手機(jī)網(wǎng)站建設(shè)、ChatGPT、自適應(yīng)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)