问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

如何增加 Bootstrap navbar-brand 字体大小？

社区维基
1
新手上路，请多包涵

我有一个基本的引导导航栏，里面有一个品牌。我的 html 的开头如下所示：

 <div class="wrapper">
    <div class="navbar navbar-white navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand" href="/">MyAwesomeCompany</a>
                etc.

看起来像这样：

在此处输入图像描述

我现在想将字体更改为 Lato 并增加字体，所以我将以下内容添加到 <head> ：

 <link href='https://fonts.googleapis.com/css?family=Lato:100' rel='stylesheet' type='text/css'>
<style>
.navbar-brand
{
  font-family: 'Lato', sans-serif;
  color:grey;
  font-size: 100px;
  margin: 0px;
}
</style>

但现在它看起来像这样：

在此处输入图像描述

正如您在 css 中看到的那样，我尝试将字体大小增加到 100 像素，但它仍然很小。有人知道我可以做些什么来增加品牌的 font-size 吗？欢迎所有提示！

原文由 kramer65 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译htmlcssbootstrapfontsfont-size
阅读 1.3k
2 个回答
得票最新
社区维基
1
✓ 已被采纳

只需使用 font-size: 100px !important; 希望这对您有所帮助。

原文由 Rahul Kashyap 发布，翻译遵循 CC BY-SA 3.0 许可协议

社区维基
1

font-size 属性指定字体的大小或高度。 font-size 不仅影响应用它的字体，而且还用于计算 em、rem 和 ex 长度单位的值。 演示 像这样尝试

.navbar-brand
{
  font-size: 100px;
}

绝对关键字和值

.navbar-brand
    {
      font-size: larger;
    }

它接受以下绝对关键字值：

 xx-small

x-small

small

medium

large

x-large

xx-large


 h1 {
    font-size: 250%;
}

h2 {
    font-size: 200%;
}

p {
    font-size: 100%;
}

 <h1>MyAwesomeCompany</h1>
<h2>MyAwesomeCompany</h2>
<p>MyAwesomeCompany</p>

原文由 Codeone 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题