Css rút gọn tiêu đề thành 2 hàng

Thông thường các sản phẩm ở Việt Nam có tên khá dài, và không đều nên lên web rất xấu. Đơn giản là hôm nay mình chia sẻ đoạn css để rút gọn tiêu đề lại cho đều với nhau. Css như sau:

p.name.product-title a {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    padding: 0;
}

Trong đó p.name.product-title a là class của tiêu đề sản phẩm trên web của bạn, các bạn nhớ thay cho đúng (cái demo là của theme Flatsome). -webkit-line-clamp: 2; là số dòng các bạn muốn cắt, nếu chỉ muốn cắt thànhh 1 dòng thì thay bằng số 1.

Chúc các bạn thành công!

You May Also Like

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *