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; } ```