03day
2018-07-09 本文已影响0人
秋殇灬
<em>和<strong>
1、em即“emphasize”。<em>表示强调，<strong>表示更强烈的强调。
2、<em>默认样式是斜体，<strong>默认样式是粗体。
3、<em>用来局部强调，<strong>则是全局强调。从视觉上考虑，<em>的强调是有顺序的，阅读到某处时，才会注意到。<strong>的强调则是一种随意无顺序的，看见某文时，立刻就凸显出来的关键词句。斜体和粗体刚好满足了这两种视觉效果，因此也就成了<em>和<strong>的默认样式。
可以直接将样式写到标签内部的style属性中，这种样式不用填写选择器，直接编写声明即可
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css</title>
</head>
<body>
<p style="color: red;font-size: 40px;">窗前明月光</p>
<p style="color: green;font-size: 40px;">疑是地上霜</p>
<p>举头望明月</p>
<p>低头思故乡</p>
</body>
</html>
image.png
但是这样做肯定是不行的
<2>style标签 内部样式表
下面是把所有p标签的颜色和字体变成style标签里的颜色和字体
一、按钮
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css</title>
<style type="text/css">
p{
color: red;
font-size: 40px;
}
</style>
</head>
<body>
<p>窗前明月光</p>
<p>疑是地上霜</p>
<p>举头望明月</p>
<p>低头思故乡</p>
</body>
</html>
运行结果
image.png
<3> link 外部样式表
可以将所有的样式保存到一个外部的css文件中，然后通过<link>标签将样式表引入到文件中。
一、按钮练习
<!DOCTYPE html>
<html>
<head>
<title>按钮练习</title>
<meta charset="utf-8" />
<style type="text/css">
.cc{
display: block;
width: 161px;
height: 44px;
background-image: url(amazon-sprite_.png)
/*background-repeat: no-repeat;*/
}
.cc:active{
display: block;
width: 43px;
height: 31px;
background-image: url(amazon-sprite_.png);
/*background-repeat: no-repeat;*/
background-position: -58px -338px;
/*.cc:active{
background-image: url(timg3.jpg);
background-position: -400px 0px;
}*/
</style>
</head>
<body>
<a href="#" class="cc"></a>
</body>
</html>
