在这里，我们来看看各种字体属性。这些是命名空间中的属性—那些在其名称开头包含单词的属性。fontfont
CSS字体属性使您能够更改文本的外观。例如，您可以分配字体系列、应用粗体或斜体格式、更改大小等。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
字体系列
字体系列属性允许您设置字体系列。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-family: Georgia, Garamond, serif;
}
</style>
<p>This text is rendered in either georgia, garamond, or the default serif font (depending on which font the user's system has).</p>字体系列属性接受不同字体系列的列表。这是因为，并非所有用户都会在其计算机上安装相同的字体。因此，作为设计人员/开发人员，您可以提供字体列表，从您的第一个选择开始，到您的最后一个选择结束。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
因此，如果用户没有您的第一选择字体，则第二选择将用于该用户。如果他们没有第二选择，将使用第三选择，依此类推。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
最好将最后一个选择设置为通用字体系列，例如or（具体取决于您是否需要带衬线的字体）。这样，如果用户的计算机上没有其他选择，则他们的计算机将根据您提供的通用系列选择其计算机上的字体。serifsans-serif文章源自你的网络首码项目网-https://www.youranweb.com/254.html
字体大小
使您可以设置文本的大小。有关可能值的信息，请参阅字体大小页面。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-size: 30px;
}
</style>
<p>This text is using a font size of 30 pixels.</p>字体大小调整
此属性使您能够调整x高度以使字体更清晰。有关详细信息，请参阅字体大小调整页面。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-size: 12px;
font-size-adjust: 0.58;
}
</style>
<p>This text is using a font-size-adjust value.</p>字体拉伸
此属性依赖于用户的计算机具有正在使用的字体的扩展或压缩版本。有关所有可能的值，请参阅字体拉伸页。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-stretch: ultra-expanded;
}
</style>
<p>If your computer has an expanded version of the font being used, this text will be stretched.</p>字体样式
字体样式属性用于指定斜体文本。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-style: italic;
}
</style>
<p>This text is in italics.</p>字体变体
使您可以将文本设置为使用小写字母。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-variant: small-caps;
}
</style>
<p>This Text Is Using Small Caps.</p>字体粗细
使您能够将文本设置为粗体。有关详细信息，请参阅字体粗细。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font-weight: bold;
}
</style>
<p>This text is bold.</p>字体属性
font属性是一个速记属性，可用于一次性设置所有字体属性。文章源自你的网络首码项目网-https://www.youranweb.com/254.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
font: italic small-caps bold 20px Georgia, Garamond, serif;
}
</style>
<p>The styles for this text has been specified with the 'font' shorthand property.</p>文章源自你的网络首码项目网-https://www.youranweb.com/254.html 文章源自你的网络首码项目网-https://www.youranweb.com/254.html
评论