Bài tập html và css

Trong bài bác này, chúng ta sẽ áp dụng hồ hết thuộc tính đã học tập, kết phù hợp với bí quyết dùng phông cùng icon được giải đáp giữa những bài xích trước để gia công bài xích tập. Đồng thời sẵn sàng đầy đủ bước quan trọng để học tiếp các ở trong tính với hiệu ứng hover nâng cao.

You watching: Bài tập html và css


"Người ta tắt AdsBlock chưa hẳn vày tín đồ ta lẩn thẩn, mà lại người ta quý mình bắt buộc coi quảng cáo"Hosting WordPress nhanh, thấp với dễ sử dụng bao gồm miễn phí SLL hãy chọn Azdigi nhé.Link đăng ký: NHẬN NGAY ƯU ĐÃINếu những bạn mua hosting tự links trên, mình sẽ có một không nhiều tiền nhằm gia hạn. Cảm ơn

Mục tiêu cần đạt: Phần trong form màu đỏ

+ Bố viên và trình bày nlỗi mẫu mã vẫn chọn.

+ Áp dụng các phần đang học tập nhằm cách xử trí phần title của khối hận.

+ Phần icon dùng fonts awesome cùng dồn các kăn năn lại thành 1 hàng.

*
Nội dung bài xích tập phần icon mạng xã hội của theme Newstube

"Thành lập và hoạt động, cuộc sống thường ngày bươm chải, gồm có tác dụng vẫn không tồn tại ăn" đề xuất cần đính QUẢNG CÁOCác bạn cần hosting WordPress nkhô cứng, phải chăng với dễ dàng thực hiện tất cả miễn phí SLL nên chọn Azdigi nhé.Link đăng ký: NHẬN NGAY ƯU ĐÃINếu các bạn đặt hàng hosting từ bỏ links trên, bản thân sẽ có một ít chi phí để gia hạn. Cảm ơn

Lời giải

Phần tiêu đề kăn năn sử dụng các thuộc tính

+Nên có 1 div bao phía bên ngoài với 1 thẻ p hoặc thẻ heading

+ Sử cần sử dụng phương pháp thêm Google fonts hoặc cần sử dụng fonts tải về.

+ Thuộc tính display: inline để màu sắc nền ôm giáp chữ.

+ Boder: 2px, solid black

Phần các icon

+ Chia thành 3 khối, dùng 1 div không giống bao bên phía ngoài 3 khối.

See more: Hướng Dẫn Cách Sắp Xếp Thuốc Tại Nhà Thuốc Trong Nhà Thuốc, 6 Nguyên Tắc Xếp Thuốc Đạt Chuẩn Gpp

+ Dùng font awesome.

+ Mỗi kăn năn gồm nằm trong tính float:left để dồn các kăn năn nhỏ thành 1 sản phẩm.

+ Khối bao kế bên bao gồm overflow: hidden để rời lỗi

Kết quả

*
Kết trái bài bác tập

Các ở trong tính vẫn hướng dẫn

+ float: left (right) dồn những khối

+ overflow: hidden

+ display: block

+ display: inline

+ margin với padding

+ border : viền, 1px (độ dày) black (màu) solid (loại nét)

+ text-align : canh lề

+ font-size : size.

+ font-weight : bold độ đậm nphân tử, hệt như thẻ

+ font-family : vẻ bên ngoài chữ

+ font-style: italic : tạo nên chữ in nghiêng

+ float : left, dồn qua 1 bên

+ text-decoration: none, underline.

+ line-height: 20px: độ giãn chiếc.

+ color: (màu chữ) dùng green, red tuyệt mã màu

+ background-color: (màu nền)black

+ background-image: url(imgage source).

See more: Chơi Game Đại Chiến Siêu Hùng Đại Chiến 5, Game Siêu Hùng Đại Chiến 5

Code mẫu: Download

Nếu bao gồm vướng mắc, đặt câu hỏi bằng cách comment dưới, qua email, hoặc nhắn tin qua Fanpage Góc có tác dụng web.