7-3外部式css樣式，寫在單獨的一個文件中 · 初識HTML+CSS

外部式css樣式(也可稱為外聯式)就是把css代碼寫一個單獨的外部文件中，這個css樣式文件以“`.css`”為擴展名，在內（不是在標簽內）使用標簽將css樣式文件鏈接到HTML文件內，如下面代碼： `<link href="**base.css**" rel="stylesheet" type="text/css" />` 注意： 1、css樣式文件名稱以有意義的英文字母命名，如 main.css。 2、rel="stylesheet" type="text/css" 是固定寫法不可修改。 3、標簽位置一般寫在標簽之內。 ### **任務** 我來試一試：用外部式css樣式設置文字字號 1、單擊打開`style.css`文件(在index.html的右側)，在第`3`行輸入代碼`font-size:20px;`觀察結果窗口中文字大小的變化。 ``` <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>嵌入式css樣式</title> <link href="style.css"/*要自己設置*/ rel="stylesheet" type="text/css" /> </head> <body> 慕課網，超酷的互聯網、IT技術免費學習平臺，創新的網絡一站式學習、實踐體驗；服務及時貼心，內容專業、有趣易學。專注服務互聯網工程師快速成為技術高手！ </body> </html> ``` ***** ``` span{ color:red; } ```