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

0

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

Nội dung thực hiện

Mẫu Làm bài tập trang Cafef.vn, thuộc tính margin: auto, text-transform: uppercase
mẫu bài tập trang Cafef.vn

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.

+ 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 LikeShare nếu thấy bài viết thú vị.

Liên hệ

Để lại một trả lời

Địa chỉ email của bạn sẽ không được công bố.