设计字体样式

2019-03-02  本文已影响0人  大风吹兮风清扬

在解决方案中,我指定了 font-family:Helvetica, Arial, sans-serif;。因此,浏览器首先尝试渲染 Helvetica 字体。在 Mac 上也同样适用,因为 Helvetica 是随操作系统一起打包提供的标准字体。但是,在 Windows 和 Linux 机器上,默认情况下这些操作系统可能(无法)支持 Helvetica 字体,因此浏览器会尝试使用 Arial 字体。如果没有 Arial 字体,则浏览器将使用任何可用的 sans-serif 字体。

<!DOCTYPE html>

<!-- Instructions: Replicate the same styling seen in the Udacity text below. -->

<html>
<head>
    <title>Style the Font Quiz</title>
    <style>
        .udacity-text {
            /* add CSS here */
            font-family: Helvetica, Arial, sans-serif;
            color: #8001ff;
            text-decoration: underline;
            text-transform: uppercase;
            font-size: 60px;
        }
    </style>
</head>
<body>
    <h1 class="udacity-text">udacity</h1>
</body>
</html>

font-family 属性用于将字体更改为 Helvetica、Arial 或者是安装在操作系统上的默认 sans-serif 字体。

接下来,font-size 属性用于放大字体, text-transform 和 text-decoration 属性用于将文本变成大写形式和为文本加下划线。

最后,color 用于将颜色更改为在如下解决方案图片中所看到的紫色。

请查看更改颜色前后的对比:

image
上一篇 下一篇

猜你喜欢

热点阅读