PHP从入门到精通,019第三章CSS之CSS的引入方式(DAY4第3课)

(二)、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
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞