关于css:CSS内联样式的使用设置字体属性

1,CSS设置字体名称属性(font-family):

示例:

<style> 
.fs1{
font-family:Arial, Helvetica, sans-serif;
}

.fs2{
font-family:黑体;
}

.fs3{
font-family:"Times New Roman", Times, serif;
}

</style>
<span class="fs1">CSS设置字体属性</span><br />
<span class="fs2">CSS设置字体属性</span><br />
<span class="fs3">CSS设置字体属性</span><br /> 

2,CSS设置字体大小属性(font-size):

示例:

<style> 
.fs1{
font-size:12px;
}

.fs2{
font-size:16px;
}

.fs3{
font-size:18px;
}

.fs3{
font-size:24px;
}
</style> 
<span class="fs1">CSS设置字体大小属性</span><br />
<span class="fs2">CSS设置字体大小属性</span><br />
<span class="fs3">CSS设置字体大小属性</span><br />
<span class="fs4">CSS设置字体大小属性</span><br /> 

3,CSS设置字体粗体属性(font-weight):

示例:

<style> 
.b{
font-weight:bold;
} 
</style>

<span>CSS设置字体粗体,无粗体!</span><br />
<span class="b">CSS设置字体粗体,有粗体</span><br /> 

4,CSS设置字体斜体属性(font-style:italic;):

<style> 
.i{
font-style:italic;
} 
</style>

<span>CSS设置字体斜体,无斜体!</span><br />
<span class="i">CSS设置字体斜体,有斜体</span><br /> 

5,CSS设置字体色彩属性(color)

示例:

<style>
body{
font-size:14px;
}

.color1{
color:#000;
} /*彩色*/

.color2{
color:#f00;
} /*红色*/

.color3{
color:green;
} /*绿色*/

.color4{
color:orange;
} /*橙色*/

.color5{
color:blue;
} /*蓝色*/

div{
text-align:center; 
padding-top:32px; 
width:600px; 
margin:0px auto;
} 
</style>

<span class="color1">CSS设置字体色彩 彩色!</span><br />
<span class="color2">CSS设置字体色彩 红色!</span><br />
<span class="color3">CSS设置字体色彩 绿色!</span><br />
<span class="color4">CSS设置字体色彩 橙色!</span><br />
<span class="color5">CSS设置字体色彩 蓝色!</span><br />

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理