新手应该直接拿 Bootstrap 来套吗？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 3220 天前的主题，其中的信息可能已经有所发展或是发生改变。

在给自己的小网站写样式。之前没接触过 CSS ，看了看书，开始动手写。结果到导航栏就卡住了。
根本不知怎么配色，便从 Bootstrap 的默认主题里选了一些。但然后，又开始纠结诸如：“这个组织名称和用户登录状态的文字要不要放进<nav>？”“我想让那部分文字在右侧，用float: right是一般做法吗？（见 V2EX 用的是一个<table>）”之类的问题。（那本书中没有讲display: flex，看上去很好，但是我担心有人用微信打开它，会有问题吧。）
并且，见许多示例都直接写width: ?px。不是要响应式吗？如果是如max-width: 750px这样的我还能理解，毕竟见过一行字占满整个屏幕宽度的网页。但直接指定宽度真的不会出问题？如果rem大了，或者 viewport 奇怪一点，不就会……
这是现在的导航栏。还没考虑在移动设备上的效果

<header>
    <span class="brand">Brand</span>
    <nav>
        <ul>
            <li><a href="/">Home</a></li>
            <li class="active"><a href="/about/">About</a></li>
        </ul>
    </nav>
    <div class="text"><a href="/login/">Login</a></div>
</header>

.brand {
    font-size: 0.75em;
    text-align: left;
}

nav{
    display: inline-block;
}

nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

nav li {
    display: inline-block;
    padding: 0.5em;
}

nav li.active {
    background-color: white;
}

nav a {
    font-size: 150%;
    color: #777;
    text-decoration: none;
}

header .text {
    float: right;
    padding: 0.5em;
}

我想先写好大概的样式，然后再去调整不同设备上的效果。然而，在登录页，我想让登陆按钮与上面的文本框右对齐，但是不是只能把<form>放进一个指定了width的<div>，然后再text-align: right？
有点想直接拿 Bootstrap 套上。但看着文档里那一堆嵌套的div和class，便有些退却了。想问问各位应该怎样开始。