开发者学堂课程【CSS 快速掌握:字体属性】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/611/detail/9172
字体属性
内容介绍
一、属性名具体内容
二、代码演示
一、属性名具体内容
属性名:font-stylee值:normal(正常)、(italic)斜体 功能:设置文本为斜体。
属性名:font-weightr 值 normal(正常)、bolde 功能:设置文字粗细。
属性名:font-size 值:如12 px、14 px。功能:给文本设置大小。
属性名:font-family 值:微软雅黑、楷体、宋体.... 功能: 给文本设置字体。
属性名:fonte 值:举例:font:italic bold 14px“微软雅黑 功能:简写属性能够同时给文本设置斜体、加粗、大小、字体每一个值之间需要使用空格 并且一定要有顺序。
关于字体:一般很特殊的字体 网站上面都是使用图片来表示。是否能够显示此字体是根据用户电脑里面是否有对应的字体文件,如果没有该文件就会显示为宋体。
二、代码演示
<title>
字体属性</title>
<style type="text/css">
.zhang{
font-style:italic
;/*将文本设置为斜体*/
font-weight:bold;/*
将文本设置加粗效果*/
font-size:36px;/
设置文本的大小*/
font-family:“
黑体”,“宋体”,“微软雅黑”;
}
I{
font-style:normal
;/*将斜体恢复正常*/
}
B{
font-weight:normal;/*
将加粗效果恢复正常*/
}
.lin{
/
分别设置的*/
/*font-style:italic;
font-weight:bold;
font-size:24px;
font-family:"楷体”;*/
font:italic bold 24px“
楷体";/
}
</style>
</head>
<body>
<h3>
诛仙</h3>
<p>
故事是从一个叫做<span class="zhang">张小凡</span>的普通少年开始的。<i>机缘巧合,</i>一位<b>天音寺</b>名为普智的高…除了张小凡和<span class="lin">林惊羽</span>两个小孩…
七脉会武</p>
</body>
</html>