Bài 15: Làm bài tập trang Cafef.vn

Trong bài tập Cafef.vn, mình sẽ hướng dẫn các bạn ôn lại các thuộc tính cũ. Đồng thời, giới thiệu thêm một số thuộc tính margin: auto, text-transform: uppercase.

Video – Làm bài tập trang Cafef.vn

Hướng dẫn chi tiết

"Thăm ngàn, kẹp ngần nhưng vẫn không đủ chai ni (trả nợ)" nên dành vài dòng cho QUẢNG CÁO

Các bạn cần hosting PHP - WordPress nhanh, rẻ và dễ sử dụng có thể chọn Azdigi nhé.
Link đăng ký: NHẬN NGAY ƯU ĐÃI
Nếu các bạn đăng ký hosting từ link quảng cáo, mình sẽ có một ít tiền để duy trì và "chai ni".

Nội dung thực hiện

Các nội dung cần làm

+ Dùng margin:auto để cho cả khối tổng tự canh giữa

+ Tiêu đề lớn sẽ viết in hoa toàn bộ. Dùng thuộc tính text-transform: uppercase. Trong thực tề, người dùng web khi làm nội dung và up lên website thường không chú ý in hoa, có phần in hoa, có phần không, làm ảnh hưởng đến sự đồng nhất thiết kế. Thuộc tính text-transform: uppercase giúp giúp nội dung dù người viết nhập vào chữ thường hay in hoa thì đều chuyển thường in hoa.

"Thăm ngàn, kẹp ngần nhưng vẫn không đủ chai ni (trả nợ)" nên dành vài dòng cho QUẢNG CÁO

Các bạn cần hosting PHP - WordPress nhanh, rẻ và dễ sử dụng có thể chọn Azdigi nhé.
Link đăng ký: NHẬN NGAY ƯU ĐÃI
Nếu các bạn đăng ký hosting từ link quảng cáo, mình sẽ có một ít tiền để duy trì và "chai ni".

+ Hình ảnh cho float:right.

+ Ba khối bên dưới cho float: left, mình sẽ hướng trong phần kế tiếp.

Các thuộc tính mới

+ margin: auto

+ text-transform: uppercase

Các thuộc tính đã hướng dẫn

+ box-shadow: 2px 2px 7px;

+ transition: 0.4s;

+ position: relative

top: 15px;

lelf: 20px;

+ float: left (right) dồn các khối

+ overflow: hidden

+ display: block

+ display: inline

+ 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: 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ị.

Liên hệ