CSS入门

最新推荐文章于 2024-05-24 01:00:03 发布

fxy流年无悔

最新推荐文章于 2024-05-24 01:00:03 发布

阅读量321

点赞数

分类专栏： web 文章标签： css

本文链接：https://blog.csdn.net/a716121/article/details/52102564

版权

web 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

1.使用CSS

2.三种方式

3.层叠和继承

代码：

index.html:

<!DOTTYPE html>
<html lang ="zh-cn">
<head>
   <meta charset="utf-8">
   <title>CSS入门</title>
   <link rel="stylesheet" type="text/css" href="style.css">
   <link rel="stylesheet" type="text/css" href="test.css">
   <style type="text/css">
   p{
   color:red;
   font-size:50px;
   }


   p{
     color:green;
     font-size:30px;
     font-style:italic;
   }


   p{
   color:red;
   border:1px solid bule;
   >
   b{
   border:inherit;///继承border属性
   }
   </style>
</head>
<body>
///法一：
<p style="color:red;font-size:50px;">这是一段文本</p>


///法二：
<p>这是另一段文本</p>



///法三：
<p>这是第三段<b>文本</b></p>



<b>b元素本身隐含加粗样式</b>

<span style="font-weight:bold;">span元素没有隐含，但可以设置它加粗</span>

<b style="font-weight:normal;" >去除b元素的隐含样式</b>


<p style="font-size:50px;color:orange;">我要叠加三种定义样式的方式</p>


<p>这是<b>HTML5</b></p>

</body>
</html>

style.css

@charset "utf-8";

@import "text.css";

p{
color:red;
font-size:50px;
}


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

test.css

@charset "utf-8";

b{
 font-style:italic;
}

ppt:

fxy流年无悔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录