Twitter Bootstrap: Văn bản trong thanh điều hướng


109

Theo tài liệu bootstrap của twitter , tôi sẽ có thể "Gói các chuỗi văn bản trong một <p>thẻ để có màu và màu sắc phù hợp." Khi tôi làm điều này, ở bất kỳ cấp nào dưới navbarnó đơn giản là không kế thừa bất kỳ navbarlớp nào. Việc bao bọc chuỗi trong <a>các thẻ hiển thị nó nhưng nó không phải là một anchor.

Chuỗi tôi đang cố gắng kết xuất là "Logged in as ... ".

Câu trả lời:


237

Bạn phải bao gồm một lớp cùng với pthẻ của bạn bên trong thanh điều hướng, như sau:

<p class="navbar-text">Logged in as</p> 

2
@capncaveman, những người trên twitter không bao gồm điều đó đủ kỳ lạ, nhưng bạn có thể thấy nó trên các ví dụ trang của họ.
Andres Ilich

35
Đối với những gì nó đáng giá, tôi đã phải sử dụng <p class="nav navbar-text">để có được định dạng chính xác.
eaj

Cảm ơn vì điều đó! FYI @eaj w / 3.3.6 Tôi không cần .nav. Câu hỏi: Có lớp Bootstrap tiêu chuẩn nào vô hiệu hóa văn bản <p> khỏi vùng chọn không?
Matthew Cornell

1
@MatthewCornell không có gì mà tôi biết nhưng bạn có thể "giả" nó bằng cách tạo kiểu ::selectionmàu cho màu nền và đặt lại thuộc cursortính về mặc định khi di chuột, như vậy cursor: default;.
Andres Ilich


2

Tôi đã phải thêm <span class="navbar-text">cho định dạng ngang bằng với các thẻ liên kết.


0

Không có câu trả lời hoặc nhận xét nào trong số này phù hợp với tôi (câu trả lời mới nhất là 6+ tuổi), nhưng những gì hiệu quả với tôi là:

  1. Tôi phải sử dụng <span>thẻ, không phải<p>
  2. Tôi đã phải đưa "nav-item"lớp vào chính phần tử danh sách của mình

Mã làm việc cuối cùng của tôi trông như thế này:

<li class="nav-item"><span class="navbar-text"><h5>{{first_name}}</h5></span></li>

Hãy từ của tôi cho nó, nhưng từ "Sally" bên dưới không chuyển thành siêu liên kết khi di chuột.

nhập mô tả hình ảnh ở đây

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.