Trong bài này, mình sẽ hướng dẫn hiệu ứng hover bằng css cho các thẻ HTML. Ví dụ đơn giản trong bài là tiêu đề của bài viết đổi màu khi trỏ chuột vào.
Nội dung chính
Video – Hiệu ứng hover bằng css và làm bài tập
Hướng dẫn bài tập
Phần tin chính của trang web
Phần CSS
Một lưu ý quan trọng
Thuộc tính margin và padding chỉ dùng cho các thẻ khối <div></div>, không dùng được cho các thẻ inline không xuống dòng như <a></a>. Thẻ không xuống dòng muốn dùng được phải thêm thuộc tính display: block.
Để không bị lỗi khi chạy trên các trình duyệt khác nhau, chúng ta nên xóa các margin và padding mặc định của trình duyệt.
Các thuộc tính CSS mới
+ display: block
Các thuộc tính CSS đã học cho tới bài này
+ Margin và padding
+ Border : viền, 1px (độ dày) black (màu) solid (loại nét)
+ Text-align : canh lề
+ Font-size : kích thước.
+ Font-weight : bold độ đậm nhạt, giống như thẻ <b></b>
+ Font-family : kiểu chữ
+ Font-style: italic : tạo chữ in nghiêng
+ Float : left, dồn sang một bên
+ Text-decoration: none, underline.
+ Line-height: 20px: độ giãn dòng.
+ color: (màu chữ) dùng green, red hay mã màu
+ background-color: (màu nền)black
+ background-image: url(imgage source)
Code mẫu đầy đủ: Download
Nếu có thắc mắc, đặt câu hỏi bằng cách comment bên dưới, qua email, hoặc nhắn tin qua Fanpage Góc làm web.
Đừng quên Like, Share nếu thấy bài viết thú vị.