Thứ Năm, 24 tháng 8, 2017

[HTML bài 7] Các bài tập về thuộc tính (Attributes) trong HTML

Bài này thuộc phần 7 của 7 trong series Học HTML cơ bản

Trong bài này tôi sẽ viết các bài tập về thuộc tính để các bạn thực hành những gì đã tìm hiểu ở bài trước. Để tiện lợi, nhanh chóng, đơn giản làm các bài tập này, các bạn có thể dùng các công cụ soạn thảo code trực tuyến mà tôi đã giới thiệu ở bài [Học HTML] Các công cụ soạn thảo code trực tuyến.

1. Bài tập 1 về thuộc tính

Thêm một chú giải vào đoạn văn dưới đây với nội dung “Về binhnet.com”.

<!DOCTYPE html>
<html>
<body>

<p>binhnet.com là một Blog Wordpress dùng để chia sẻ kiến thức.</p>

</body>
</html>

Gợi ý của bài tập 1

Gợi ý: Sử dụng thuộc tính title.

Câu trả lời của bài tập 1

<!DOCTYPE html>
<html>
<body>

<p title="Về binhnet.com">binhnet.com là một Blog Wordpress dùng để chia sẻ kiến thức.</p>

</body>
</html>

2. Bài tập 2 về thuộc tính

Thay đổi kích thước của hình ảnh lên 320 pixel rộng và cao 320 pixel

<!DOCTYPE html>
<html>
<body>

<img src="binhnet.jpg" width="200" height="200">

</body>
</html>

Gợi ý của bài tập 2

Gợi ý: Thay đổi các thuộc tính  width và height.

Câu trả lời của bài tập 2

<!DOCTYPE html>
<html>
<body>

<img src="binhnet.jpg" width="320" height="320">

</body>
</html>

3. Bài tập 3 về thuộc tính

Chuyển văn bản dưới đây thành một liên kết đến “http://ift.tt/2wLehsf;

<!DOCTYPE html>
<html>
<body>

Đây là một liên kết

</body>
</html>

Gợi ý của bài tập 3

Gợi ý: Thêm một phần tử <a> chứa thuộc tính href.

Câu trả lời của bài tập 3

<!DOCTYPE html>
<html>
<body>

<a href="http://binhnet.com">Đây là một liên kết</a>

</body>
</html>

4. Bài tập 4 về thuộc tính

Thay đổi đích đến của liên kết bên dưới thành “baitap.com”.

<!DOCTYPE html>
<html>
<body>

<a href="http://binhnet.com">Đây là một liên kết</a>

</body>
</html>

Gợi ý của bài tập 4

Gợi ý: Thay đổi thuộc tính href.

Câu trả lời của bài tập 4

<!DOCTYPE html>
<html>
<body>

<a href="http://baitap.com">Đây là một liên kết</a>

</body>
</html>

5. Bài tập 5 về thuộc tính

Hình ảnh dưới đây không tồn tại. Chỉ định văn bản thay thế “binhnet.com” cho hình ảnh.

<!DOCTYPE html>
<html>
<body>

<img src="binhnet.jpg" width="640" height="90">

</body>
</html>

Gợi ý của bài tập 5

Gợi ý: Sử dụng thuộc tính alt.

Câu trả lời của bài tập 5

<!DOCTYPE html>
<html>
<body>

<img src="binhnet.jpg" alt="binhnet.com" width="640" height="90">

</body>
</html>

6. Lời cuối bài

Qua bài viết này các bạn có thể hiểu rõ hơn về cách sử dụng các thuộc tính trong HTML. Bài này viết nhằm ôn lại kiến thức các bạn đã xem ở bài trước.

The post [HTML bài 7] Các bài tập về thuộc tính (Attributes) trong HTML appeared first on Học online.



from WordPress http://ift.tt/2wsNPUE
via IFTTT

Không có nhận xét nào:

Đăng nhận xét