PHP从入门到精通，019第三章CSS之CSS的引入方式（DAY4第3课）

2023年2月23日 304次阅读 来源: 极客研习社

（二）、CSS的引入方式

1、内嵌方式：把CSS样式表通过一对标签写在HTML文件的head标签中，当成HTML的标记来使用，一般情况下都是写在head中，不推荐写到别的地方。

语法：
<style type="text/css">
语法规则
</style>

案例代码

<head>
  <meta charset="utf-8" />
  <title>极客研习社</title>
  <style type="text/css">
    div {
    width:200px;
    height:200px;
    border:1px solid red;
    margin:100px auto;
    }
  </style>
</head>
<body>
  <div></div>
</body>

2、行内方式：把CSS样式当成HTML的一个属性来写，如：

<div style="值">
</div>
语法：
<h1 style="color:red;font-size:50px;">极客研习社</h1>

案例代码：

<p style="color:red;font-size:50px">极客研习社</pa>

3、外链方式：把CSS样式表写到一个以.css为结尾的文件中（index.css），把这个文件引入到某个HTML文件中，当前HTML文件就会有CSS的效果实现，好处：一个css文件可以给多个HTML文件使用。

语法：
<link rel="stylesheets" type="text/css" href="具体的css文件路径" />

可以引入多个CSS文件，几个页面一样引入一个。

4、@import：可以在一个CSS文件中再次引入一个CSS文件。

语法：
@import url("要引入的CSS文件路径"); //结尾要有分号！！！
    原文作者：极客研习社
    原文地址: https://www.jianshu.com/p/029cbaec7f21
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞