Trên trang chỉ mục của tôi, tôi muốn màu văn bản h1 có màu trắng và đi kèm với bóng, nhưng tôi không muốn thay đổi hành vi mặc định là h1 trên các trang khác. Làm thế nào tôi có thể đạt được điều này?Với Twitter Bootstrap, làm cách nào tôi có thể tùy chỉnh màu văn bản h1 của một trang và để các trang khác được mặc định?
Trả lời
Bạn có thể thêm id hoặc class của riêng bạn để thẻ nội dung của trang index của bạn để nhắm mục tiêu tất cả các yếu tố trên trang đó với một phong cách tùy chỉnh như sau:
<body id="index">
<h1>...</h1>
</body>
Sau đó, bạn có thể nhắm mục tiêu các yếu tố bạn muốn sửa đổi với lớp hoặc id của bạn như vậy:
#index h1 {
color:red;
}
bạn cũng có thể áp dụng mặc định 'text' lớp học có sẵn từ bootstrap tự
<h1 class='text-info'>Hey... I'm blue</h1>
trong bootstrap 3 đây là những lớp học để thay đổi màu sắc văn bản:
<p class="text-muted">...</p> //grey
<p class="text-primary">...</p> //light blue
<p class="text-success">...</p> //green
<p class="text-info">...</p> //blue
<p class="text-warning">...</p> //orangish,yellow
<p class="text-danger">...</p> //red
Tài liệu dưới Helper classes - Contextual colors.
Giải pháp tốt hơn đã chấp nhận câu trả lời. Liên kết bên: http://getbootstrap.com/css/#helper-classes – trante
Thực ra, tuy nhiên đây là câu trả lời rất hay, không hoạt động cho màu tùy chỉnh mà không thay đổi màu theo ngữ cảnh của văn bản. Có lẽ bạn có thể upvote câu trả lời này bởi vì là tốt, nhưng câu trả lời thực sự cho câu hỏi OP là chấp nhận. –
Ngoài câu trả lời của @Connor Leech.
Nếu bạn muốn tạo kiểu chữ tùy chỉnh mới của riêng mình, hãy xác định các điều sau trong tệp css của bạn.
.text-foo {
.text-emphasis-variant(#FFFFFF);
}
Kết hợp text-emphasis-variant
được định nghĩa trong tệp Bootstrap's mixins.less
.
Sau khi xem xét kỹ này bản thân mình (Sử dụng lớp Màu Chữ trong câu trả lời Connor Leech của)
Được cảnh báo phải chú ý cẩn thận đến lớp "navbar-text".
Để có được văn bản màu xanh lá cây trên navbar ví dụ, bạn có thể bị cám dỗ để làm điều này:
<p class="navbar-text text-success">Some Text Here</p>
này sẽ không hoạt động !! "navbar-text" ghi đè màu và thay thế bằng màu văn bản thanh điều hướng tiêu chuẩn.
Cách đúng để làm điều đó là để tổ văn bản trong một yếu tố thứ hai, EG:
<p class="navbar-text"><span class="text-success">Some Text Here</span></p>
hoặc trong trường hợp của tôi (văn bản như tôi muốn nhấn mạnh)
<p class="navbar-text"><strong class="text-success">Some Text Here</strong></p>
Khi bạn làm theo cách này, bạn sẽ có được văn bản được căn chỉnh phù hợp với chiều cao của thanh điều hướng và bạn cũng có thể thay đổi màu sắc.
bạn có thể sử dụng kiểu font Giống như:
<font color="white"><h1>Header Content</h1></font>
Thẻ phông chữ? Điều đó đã bị phản đối một thập kỷ trước. – mwieczorek
Có lớp helper trong bootstrap 3 với màu sắc theo ngữ cảnh xin vui lòng sử dụng các lớp học trong các thuộc tính html.
<p class="text-muted">...</p>
<p class="text-primary">...</p>
<p class="text-success">...</p>
<p class="text-info">...</p>
<p class="text-warning">...</p>
<p class="text-danger">...</p>
tham khảo:http://getbootstrap.com/css/#type
Cách tốt nhất để giải quyết vấn đề này sẽ là bằng cách bắt đầu với tùy Bootstrap sử dụng công cụ tùy biến của họ.
http://getbootstrap.com/customize/
Đi xuống @ tiêu đề màu và thay đổi nó từ "thừa hưởng" một cái gì đó mà bạn muốn tiêu đề của bạn sẽ được trên trang web (nếu bạn thích mặc định chỉ cần thay đổi nó để # 333).
Lưu ý rằng điều này sẽ giữ cho tất cả các tiêu đề của bạn có cùng màu, như bạn đã yêu cầu.
Bây giờ để hoàn thành những gì bạn muốn sau khi bạn thực hiện thay đổi này, bây giờ bạn có thể ghi đè chúng cụ thể trong CSS của riêng bạn để áp dụng màu của riêng bạn cho chúng. Từ khóa "kế thừa" mà tôi luôn tìm thấy là một nỗi đau trong các khung công tác.
- 1. Làm thế nào tôi có thể tải về các ví dụ từ trang web bootstrap twitter
- 2. Twitter Bootstrap: Cố định đầu trang và thanh bên phải
- 3. Tôi có thể tùy chỉnh twitter bootstrap để làm việc với ngôn ngữ từ phải sang trái như thế nào?
- 4. Cách đặt các tùy chọn được chọn mặc định trong trang chi tiết sản phẩm Magento
- 5. Cách đặt màu tùy chỉnh trong văn bản?
- 6. Làm cách nào để gạch dưới văn bản trong TextView với một số màu khác với màu văn bản?
- 7. Làm cách nào để lưu trữ đầu trang và chân trang của trang web của tôi ở một vị trí?
- 8. Làm cách nào để sử dụng tên miền tùy chỉnh cho trang github của tôi
- 9. Tôi có thể sử dụng tagit với twitter bootstrap không?
- 10. Vấn đề hiển thị nhập văn bản với Twitter Bootstrap
- 11. Có thể sử dụng Twitter Bootstrap để tạo một trang Magento không?
- 12. Làm thế nào tôi có thể căn chỉnh hình ảnh và tiêu đề h1 một cách không ngờ?
- 13. Tại sao các nút khởi động mặc định trong bootstrap 3 tối màu xám cho tôi?
- 14. Lưu trữ ASP.Net với HTML5 JS và Twitter Các định dạng Bootstrap khác nhau
- 15. Làm cách nào tôi có thể lập trình xác định mã trang mặc định hiện tại của Windows?
- 16. Làm thế nào tôi có thể chuyển hướng một trang php đến một trang php khác?
- 17. Các trang lỗi tùy chỉnh ASP.NET MVC với Magical Unicorn
- 18. Có thể có nhiều băng chuyền Twitter Bootstrap trên một trang không?
- 19. Làm cách nào để căn chỉnh văn bản ở giữa phần tử với CSS trong Twitter Bootstrap?
- 20. Display twitter bootstrap btn nhóm inline với văn bản
- 21. Android: Làm cách nào để biết có bao nhiêu văn bản có thể vừa với textView của tôi (trang của tôi)?
- 22. Làm cách nào để có được các tiêu đề trang của tôi đổi kích thước bằng bố cục đáp ứng?
- 23. Làm cách nào để viết một tệp văn bản trong C# bằng một trang mã khác với UTF-8?
- 24. làm cách nào tôi có thể thực hiện ngắt trang bằng văn bản
- 25. Đầu trang và chân trang tùy chỉnh trong trang html
- 26. Twitter bootstrap gắn với infinitescroll và window.resize
- 27. Nhiều thẻ h1 trên một trang
- 28. Làm cách nào để trang web của tôi được thu nhỏ theo mặc định trên điện thoại di động?
- 29. Console.ReadLine ("Văn bản có thể chỉnh sửa văn bản mặc định trên dòng")
- 30. Tôi làm cách nào để in một trang web với tất cả kiểu css được gắn vào trang?
là có lớp học được xây dựng cho chức năng này – gkalikapersaud
@GavindraKalikapersaud CÓ. Xem câu trả lời của Connor Leech dưới đây. – Heraldmonkey
Hãy coi chừng, giải pháp này hoạt động với các màu tùy chỉnh mà không thay đổi màu văn bản theo ngữ cảnh. Câu trả lời này là hoàn hảo cho câu hỏi OP. Có lẽ bạn đang tìm kiếm những thứ khác. –