给html打扮一下 - 认识CSS样式，初识HTML(5)+CSS(3)-升级版教程-慕课网

7-1 给html打扮一下 - 认识CSS样式

本节编程练习不计算学习进度，请电脑登录imooc.com操作

给html打扮一下 - 认识CSS样式

CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。

如下列代码：

p{
   font-size:12px;
   color:red;
   font-weight:bold;
}

使用CSS样式的一个好处是通过定义某个样式，可以让不同网页位置的文字有着统一的字体、字号或者颜色等。

任务

我来试一试：用css样式代码修改字体大小

在右部编辑器中的第9行修改

“font-size:12px;”为“font-size:20px;”

观察结果窗口的变化。

index.html

<!DOCTYPE html>
<html>
 
<head>
    <meta charset="UTF-8">
    <title>认识CSS样式</title>
    <style type="text/css">
    p {
        font-size: 12px;
        /*设置文字字号*/
        color: red;
        /*设置文字颜色*/
        font-weight: bold;
        /*设置字体加粗*/
    }
    </style>
</head>
 
<body>
    <p>慕课网，超酷的互联网、IT技术免费学习平台，创新的网络一站式学习、实践体验；服务及时贴心，内容专业、有趣易学。专注服务互联网工程师快速成为技术高手！</p>
</body>
 
</html>