Kết quả tìm kiếm với tag ""

Vẽ pie chart, donut chart dùng CSS

Có nhiều cách để vẽ các biểu đồ trên nền web

Sử dụng @font-face để tạo font chữ theo ý muốn

Với CSS3, bạn sử dụng @font-face để chỉ định cho browser biết font chữ đó lưu trữ online và download xuống để hiển thị.
Khai báo:

@font-face {
    font-family: 'Tên_Font';
    src: url('đường_dẫn_đến_font.eot') format('embedded-opentype'),
         url('đường_dẫn_đến_font.woff') format('woff'),
         url('đường_dẫn_đến_font.ttf') format('truetype'),
         url('đường_dẫn_đến_font.svg#ten_font') format('svg');
}

Việc sử dụng nhiều loại định dạng font ở bên trên để đảm bảo chạy được trên các trình duyệt khác nhau.

Các sử dụng:
Sau khi khai báo như trên thì bạn sử dụng ‘Tên_Font’ như một font hệ thống bình thường khác:

.title {
    font-family: Ten_Font;
}

Bạn có thể sử dụng web-tool sau để convert về 4 định dạng font trên khi mà chỉ có 1 trong 4 font đó: http://convertfonts.com

Chúc bạn thành công và không còn bận tâm với sự bó buộc của lưa chọn font khi thiết kế website nữa.

Hỗ trợ CSS3 Media Query của các trình duyệt

media-query-support

Text-shadow css3

Với thuộc tính text-shadow thì bạn sẽ không phải sử dụng đến hiệu ứng đổ bóng cho chữ trong photoshop. Một ví dụ đơn giản như sau:

.btn{
background:orange;
color: white;
text-shadow: 2px 2px 2px black;
text-transform:uppercase;
}
<input type="button" class="btn" value="eten"/>

Untitled
Note : text-shadow: x y blur color;

50 thủ thuật CSS không thể bỏ qua – part V

(tiếp theo các phần trước)

Tạo button đẹp mắt đơn giản với CSS3

Trong bài viết này, tôi sẽ trình bày từng bước để tạo ra một button sử dụng CSS3. Button có thể được tạo ra từ thẻ button, input type=button hoặc thẻ a

Tạo animation sử dụng CSS3

Trong bài viết này, tôi sẽ trình bày cách sử dụng CSS3 để tạo các hiệu ứng hoạt họa thông qua sử dụng từ khóa animation. Trong nhiều trường hợp, với animation, ta có thể tạo hiệu ứng tốt thay thế cho các phương pháp truyền thống như ảnh động, flash, javascript.

50 thủ thuật CSS không thể bỏ qua – part IV

(tiếp theo các phần trước)

CSS3 :target selector

Các đường link với dấu # theo sau cho phép ta nhảy tới một thành phần trong trang HTML, thành phần đó được gọi là target element.

Một số mẹo nhỏ tối ưu CSS

CSS (Cascading Style Sheets) là một thành phần rất quan trọng trong việc thiết kế và bố cục trang web. Nó bao gồm các định dạng về màu sắc, kích thước, vị trí, phông chữ, hình nền… để làm trang web thêm sống động và rực rỡ hơn. Sau đây, mình xin giới thiệu với các bạn một số mẹo nhỏ để tối ưu css, có thể hạn chế việc phình to kích cỡ tập tin css khi chèn vào trang web.