fontawesome改变字体大小颜色

为什么直接设置i的字体大小和颜色不好使,代码如下

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
    <title>Document</title>
    <style>
        .container {
            text-align: center;
            padding-top: 10%;
        }
        i {
            font-size: '50px';
            color: '#10AEFF';
            margin-bottom: '10%'
        }
        .txt {
            font-size: 120%;
            margin-top:10%;
        }
    </style>
</head>

<body>

    <div class="container">
        <i class="fa fa-exclamation-circle fa-5x"></i>
        <div class="txt">请点击右上角在其他浏览器打开链接</div>
    </div>
    <script>
        var ua = window.navigator.userAgent.toLowerCase();
        if (!!(ua.indexOf('micromessenger') != -1)) {//是微信内置

        } else {

        }
    </script>
</body>

</html>

element如图:图片描述

阅读 2.8k
2 个回答

把 i 标签属性值的单引号去掉。

元素选择器i比类选择器.fa优先级低,所以你i里的 css 都会被默认的.fa覆盖。另外,css 里不要引号。

i.fa {
    font-size: 50px;
    color: #10AEFF;
    margin-bottom: 10%;
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题