hoatranweb
  • Kho giao diện
    • Template blogspot chuẩn seo
    • Template blogspot mỹ phẩm
    • Template blogspot thời trang
    • Template blogspot doanh nghiệp
    • Template blogspot Bất động sản
    • Template blogspot tin tức
    • Template blogspot thiết bị điện
    • Template blogspot landingpage
    • Template blogspot nội thất
    • Template blogspot du lịch
    • Template blogspot doanh nghiệp
  • Thủ thuật blog
  • Hướng dẫn
    • Thiết kế template blogspot
    • Giới thiệu
    • Hướng dẫn thanh toán
    • Hướng dẫn cài đặt
    • Liên hệ
  • Tặng template
  • Giỏ hàng ( 0 )
  • Trang chủ
  • Giới thiệu
  • Kho giao diện
  • Thủ thuật Blog
  • Hướng dẫn mua mẫu
  • Liên hệ

Tất cả các giao diện mẫu đa dạng, chuyên nghiệp
dành cho website của bạn

  • Tất cả
  • Miễn phí
  • Trả phí
  • Bán hàng
    • Công nghệ - Kỹ thuật số
    • Thiết bị điện
    • Thời trang - Trang sức
    • Thực phẩm - Nhà hàng
    • Thể thao - Dịch vụ
    • Nội thất - Trang trí văn phòng
    • Sinh hoạt - Gia dụng
    • Sách thiết bị giáo dục
    • Bất động sản - Xây dựng
    • Thủ công - Mỹ nghệ - Quà tặng
    • Ô tô - Xe máy
    • Khác
  • Doanh nghiệp
    • Nhà hàng - Khách sạn - Du lịch
    • Bất động sản - Xây dựng
    • Doanh nghiệp
Trang chủ thu-thuat-blogspot Thủ thuật blogger dùng css cắt chuỗi tiêu đề cho blogspot



[tintuc]

Thủ thuật blogger dùng CSS cắt chuỗi tiêu đề cho blogspot, sử dụng cách này chúng ta có thể cắt chuỗi văn bản của tiêu đề bài viết thành 1 hàng, 2 hàng hoặc 3 hàng.

Áp dụng cho trường hợp tiêu đề bài viết hoặc đoạn văn của blog trang web quá dài, thì bạn có thể sử dụng cách sau:


Cách 1: Cắt tiêu đề hoặc đoạn văn chỉ nằm trên 1 dòng

.catchuoi1hang {
    overflow: hidden;   // Ẩn tiêu đề hoặc đoạn văn bản bị thừa
    white-space: nowrap;  // Không cho tiêu đề hoặc đoạn văn xuống dòng
    text-overflow: ellipsis;  // Thay tiêu đề hoặc đoạn văn bản bị thừa bằng dấu 3 chấm ...
}

Tùy vào từng bố cục html, bạn có thể thêm width cho nó.. nếu cần thiết

.catchuoi1hang  {
    overflow: hidden;   // Ẩn tiêu đề hoặc đoạn văn bản bị thừa
    white-space: nowrap;  // Không cho tiêu đề hoặc đoạn văn xuống dòng
    text-overflow: ellipsis;  // Thay tiêu đề hoặc đoạn văn bản bị thừa bằng dấu 3 chấm ...
    width: 600px;
}

Cách 2 : Cắt tiêu đề hoặc đoạn văn bản thành nhiều hàng

.catchuoinhieuhang {
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 25px;
    -webkit-line-clamp: 3; // Số hàng của tiêu đề hoặc đoạn văn muốn hiển thị
    height: 75px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    width: 600px;
}

Tùy vô bố cục của từng html của blog, các bạn chỉnh các thông số màu đỏ cho phù hợp...

[/tintuc]

Có thể bạn quan tâm

Không có nhận xét nào:

© Copyright 2017
Mẫu giao diện blogspot bán hàng chuyên nghiệp
Tài khoản: 101000842765 - Trần Văn Hòa
Ngân hàng Vietinbank Chi nhánh 10 TP.HCM