前端时间学了些HTML的基本内容,现在开始学CSS,CSS之后才是真的开始前端,Javascript,jquery等等。。入题
一、CSS基本了解
CSS层叠样式表(Cascading Style Sheets)是用来表现html或者xml的一种语言,可以简单理解为CSS是用来修饰html网页的一种语言。
二、应用
添加到html中,来修饰网页,以下是三种样式表。
1、元素样式表
2、文档样式表
3、外部样式表(常用,将html和css样式分离,结构清晰)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS样式表</title>
<link rel="stylesheet" type="text/css" href="color.css">
<!-- link链接到外部样式表,采用color.css,对应word3-->
<style type="text/css">
.class2:hover{
font-size:30px;color: #ff2539;
/*设置文档内嵌样式表,所有word标签都将这个格式50,红色*/
}
</style>
</head>
<body>
<p class="class1" style="font-size: 20px;color: #2066ff">元素内嵌样式表</p><br>
<p class="class2">文档内嵌样式表</p><br>
<p class="class3">外部CSS样式表</p><br>
<!--若都设为word,则出现层叠效果,优先级:元素>文档>外部-->
<!--动作选择器hover:鼠标移到此处字体变大显色-->
</body>
</html>
word3中的外部样式表,需要在project中新建一个color.css文件,内容如下:
.class3{
font-size:40px;
color: #f123ff;
}