Tham khảo kiểu chữ CSS Bootstrap
Cài đặt mặc định của Bootstrap
Kích thước phông chữ mặc định chung của Bootstrap là 14px, với chiều cao dòng là 1,428.
Điều này được áp dụng cho <body> và tất cả các đoạn văn.
Ngoài ra, tất cả các phần tử <p> đều có lề dưới bằng một nửa chiều cao dòng được tính toán của chúng (theo mặc định là 10px).
Kiểu chữ
Các phần tử bên dưới là các phần tử HTML sẽ được Bootstrap tạo kiểu hơi khác một chút so với mặc định của trình duyệt. Hãy xem các ví dụ "Thử" để biết kết quả/sự khác biệt.
Các lớp bên dưới được sử dụng để tạo kiểu cho các phần tử hơn nữa.
Element/Class | Description | Example |
---|---|---|
<h1> - <h6> or .h1 - .h6 |
h1 - h6 headings | Try it |
<small> | Creates a lighter, secondary text in any heading
Heading (secondary text) |
Try it |
.small | Indicates smaller text (set to 85% of the size of the parent): Smaller text | Try it |
.lead | Makes a text stand out: Stand out text | Try it |
<mark> or .mark |
Highlights text: Highlighted text | Try it |
<del> | Indicates deleted text: | Thử nó |
<s> | Cho biết văn bản không còn phù hợp: | Thử nó |
<ins> | Cho biết văn bản được chèn: Đã chèn văn bản | Thử nó |
<u> | Cho biết văn bản được gạch chân: Văn bản được gạch chân | Thử nó |
<mạnh> | Biểu thị văn bản in đậm: Văn bản in đậm | Thử nó |
<em> | Cho biết văn bản in nghiêng: Văn bản in nghiêng | Thử nó |
.text-trái | Cho biết văn bản được căn trái | Thử nó |
.text-trung tâm | Cho biết văn bản được căn giữa | Thử nó |
.text-phải | Cho biết văn bản được căn phải | Thử nó |
.text-justify | Cho biết văn bản căn đều | Thử nó |
.text-nowwrap | Cho biết không có văn bản ngắt dòng | Thử nó |
.text-chữ thường | Cho biết văn bản viết thường: LOWERCASED TEXT | Thử nó |
.text-chữ hoa | Cho biết văn bản viết hoa: văn bản viết hoa | Thử nó |
.text-viết hoa | Cho biết văn bản viết hoa: văn bản viết hoa | Thử nó |
<abbr> | Phần tử <abbr> biểu thị một từ viết tắt hoặc từ viết tắt. Các chữ viết tắt có thuộc tính tiêu đề có đường viền chấm chấm ở dưới cùng và con trỏ trợ giúp khi di chuột, cung cấp thêm ngữ cảnh khi di chuột. | Thử nó |
.chủ nghĩa ban đầu | Hiển thị văn bản bên trong phần tử <abbr> với cỡ chữ nhỏ hơn một chút | Thử nó |
<địa chỉ> | Trình bày thông tin liên lạc | Thử nó |
<trích dẫn> | Cho biết các khối nội dung từ nguồn khác | Thử nó |
.blockquote-đảo ngược | Biểu thị một blockquote có nội dung được căn phải | Thử nó |
<ul> | Cho biết một danh sách không có thứ tự | Thử nó |
<ol> | Cho biết một danh sách có thứ tự | Thử nó |
.list-không theo kiểu | Loại bỏ kiểu danh sách mặc định và lề trái trên các mục danh sách (hoạt động trên cả <ul> và <ol>). Lớp này chỉ áp dụng cho các mục danh sách con ngay lập tức (để xóa kiểu danh sách mặc định khỏi mọi danh sách lồng nhau, hãy áp dụng lớp này cho mọi danh sách lồng nhau) | Thử nó |
.list-nội tuyến | Đặt tất cả các mục danh sách trên một dòng | Thử nó |
<dl> | Cho biết một danh sách mô tả | Thử nó |
.dl-ngang | Sắp xếp các thuật ngữ và mô tả trong phần tử <dl> cạnh nhau. Bắt đầu giống như các <dl> mặc định, nhưng khi cửa sổ trình duyệt mở rộng, nó sẽ xếp hàng cạnh nhau | Thử nó |
Mã số
Element/Class | Description | Example |
---|---|---|
<var> | Indicates variables: x = a b + y | Try it |
<kbd> | Indicates input that is typically entered via the keyboard: CTRL + P | Try it |
<pre> | Indicates multiple lines of code | Try it |
<pre class="pre-scrollable"> | Indicates multiple lines of code with scrollbar | Try it |
<samp> | Indicates sample output from a computer program: Sample output | Try it |
<code> | Indicates inline snippets of code: span , div |
Try it |