+5

Các Mẹo Khi Viết CSS

Dưới đây là một số mẹo khi viết Css

1. Hiển Thị Ảnh:

img.QRcode {
  image-rendering: pixelated;
}

thuộc tính image-rendering rất hữu dụng trong việc hiển thị mà QR và các ảnh thumbnails trong việc chất lượng của ảnh

2. Sử dụng thuộc tính css với Safari 11+:

@supports (padding: env(safe-area-inset)) {
  /* Your code for Safari 11+ */
}

Hàm env và biến môi trường ( environment variables ) được viết bởi Safari 11 trở lên, nhằm mục đích hỗ trợ hiển thị màn hình Iphone X

3. Kiểm tra xem có phải 1 node rỗng không

my-component:empty {
  display: none;
}

Dùng để ẩn phẩn tử khi nó không có nội dung bên trong.

4. Tạo khối cho văn bản

p {
  shape-outside: polygon(0 0, 0 200px, 300px 600px);
}

Thay đổi cách nội dùng bọc xung quanh phần tử

5.Sử dụng SVG như ảnh background

my-component {
  background-image: url('data:image/svg+xml;utf8,<svg>...</svg>');
}

Sử dụng thẻ <svg> làm background mà không cần chuyển sang base64

Nguồn

All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí