CSS的使用

最新推荐文章于 2024-07-12 18:29:20 发布

小火苗667

最新推荐文章于 2024-07-12 18:29:20 发布

阅读量768

点赞数 19

文章标签： css css3

本文链接：https://blog.csdn.net/weixin_75256538/article/details/139688788

版权

文章目录

- CSS使用方式
- CSS字体样式属性
- CSS外观属性

一、CSS使用方式

1. 行内样式

<!DOCTYPE html>
<html lang="en">
   <head>
       <title>This is title</title>
   </head>
   <body>
       <p style="font-size: 16px; color: red;">大家好</p>    </body>
</html>

2 .内部样式表

<!DOCTYPE html>
<html lang="en">
   <head>
       <title>This is title</title>
       <style>
           p {
               font-size: 16px;

color: red;
}
       </style>
   </head>
   <body>
       <p>Hello everyone</p>    </body>
</html>

3 .外部样式表
链接式
将样式写到单独的文件中，文件的扩展名为 .css 。例如， index.css 文件中有如下样式：

p{
   font-size: 16px;    color: red;
}
然后通过 <link> 元素将 index.css 文件引入到页面中：
<!DOCTYPE html>
<html lang="en">
   <head>
       <title>This is title</title>
       <link rel="stylesheet" type="text/css" href="./css/index.css">    </head>
   <body>
       <p>我是优秀的开发工程师</p>    </body>
</html>

4.css使用方式总结
(1)定义在外部文件（外链样式）：开发中主要是通过这种形式定义样式。

(2)在页面的头部定义（内联样式）：通过这种形式定义的样式只在本页面内生效。

（3）定义在特定的元素身上（行内样式）：这种形式多用于测试，可维护性较差。