Trang chủ Lớp 12 SGK Tin học 12- Chân trời sáng tạo Chủ đề F. Giải quyết vấn đề với sự trợ giúp của máy tính Bài F4. Thêm dữ liệu đa phương tiện vào trang web trang 89, 90, 91 Tin học 12 Chân trời sáng tạo: Theo em, một trang web có nội dung chỉ thuần văn bản sẽ có những hạn chế gì so với...

Bài F4. Thêm dữ liệu đa phương tiện vào trang web trang 89, 90, 91 Tin học 12 Chân trời sáng tạo: Theo em, một trang web có nội dung chỉ thuần văn bản sẽ có những hạn chế gì so với...

Với một trang web chỉ thuần văn bản sẽ làm người đọc cảm thấy nhàm chán, không thu hút được người xem. Hướng dẫn cách giải/trả lời Câu hỏi trang 89, Câu hỏi trang 90; Câu hỏi trang 91: KP, LT1, LT2, LT3, TH; Câu hỏi trang 92: TH, VD - Bài F4. Thêm dữ liệu đa phương tiện vào trang web trang 89, 90, 91 SGK Tin học 12 Chân trời sáng tạo - . Theo em, một trang web có nội dung chỉ...

Câu hỏi trang 89

Theo em, một trang web có nội dung chỉ thuần văn bản sẽ có những hạn chế gì so với trang web có thêm hình ảnh và âm thanh?

Hướng dẫn giải :

Với một trang web chỉ thuần văn bản sẽ làm người đọc cảm thấy nhàm chán, không thu hút được người xem.

Lời giải chi tiết :

Một trang web có nội dung chỉ thuần văn bản sẽ có nhiều hạn chế so với trang web có thêm hình ảnh và âm thanh. Trang web thuần văn bản sẽ đơn điệu, nhàm chán, không có điểm nhấn, không diễn tả được hết nội dung muốn thể hiện.

=> Không thu hút được người xem.


Câu hỏi trang 90

Em hãy bổ xung thuộc tính title cho thẻ <img> trong mã lệnh HTML ở ví dụ 1.

Hướng dẫn giải :

Thẻ <img> được dùng để thêm tệp ảnh vào trang web.

Lời giải chi tiết :

Code:

<!DOCTYPE html>

<html>

<head>

<meta charset=”utf-8″>

<title>Kỉ yếu lớp 12A</title>

</head>

<body>

<h1>Thành viên lớp</h1>

<img src=”D:\chan dung.jpg” width=”200″ alt=”ảnh chân dung” title=”ảnh chân dung”>

</html>


Câu hỏi trang 91 Khám phá (KP)

Em hãy bổ xung thuộc tính cho đoạn mã HTML ở ví dụ 2 để kích thước hiển thị của video là 800×600 pixels và video tự động phát không có âm thanh.

Hướng dẫn giải :

Sử dụng các thuộc tính width, loop để thiết lập kích thước và chế độ tự động phát.

Lời giải chi tiết :

Code:

<!DOCTYPE html>

<html>

<head>

<meta charset=”utf-8″>

<title>Kỉ yếu lớp 12A</title>

</head>

<body>

<h1>Thành viên lớp</h1>

<img src=”D:\chan dung.jpg” width=”200″ alt=”ảnh chân dung” title=”ảnh chân dung”>

</html>


Câu hỏi trang 91 Luyện tập (LT) 1

Chức năng các thuộc tính của thẻ <img> khi thêm tệp ảnh vào trang web là gì?

Hướng dẫn giải :

Thẻ <img> gồm các thuộc tính: src, alt, width,...

Lời giải chi tiết :

Thẻ <img> với các thuộc tính src, alt, with, height,…được dùng để thêm tệp ảnh vào trang web. Thẻ <img> chỉ có thể mở thẻ, không có thẻ đóng.

- src: đường dẫn của tệp ảnh.

- alt: nếu không hiển thị được hình ảnh, trình duyệt sẽ hiển thị văn bản trong thuộc tính alt thay thế.

- width: chiều rộng hiển thị của ảnh theo đơn vị pixel.

- height: chiều cao hiển thị của ảnh theo đơn vị pixel.

- title: hiển thị chú thích khi người dùng di chuyển con trỏ chuột lên ảnh.


Câu hỏi trang 91 Luyện tập (LT) 2

Em hãy liệt kê và nêu chức năng các thuộc tính của thẻ <audio> khi thêm tập âm thanh vào trang web.

Hướng dẫn giải :

Thẻ <audio> gồm các thuộc tính: src, autoplay, controls, muted,...

Lời giải chi tiết :

Thẻ <audio> dùng để thêm tệp âm thanh vào trang web. Hai thẻ này có thuộc tinh như: src, autoplay, controls, muted.

- src: đường dẫn tệp âm thanh thêm vào trang web.

- autoplay: tự động phát âm thanh khi người dùng truy cập trang web.

- controls: hiển thị các nút điều khiển.

- muted: tắt âm thanh.


Câu hỏi trang 91 Luyện tập (LT) 3

Giả sử tệp portfolio.html nằm cùng nơi với thư mục Asset. Thư mục Sound, là thư mục con của thư mục Asset, có chứa tệp bai_hat.mp3. Theo em, đường dẫn cho thuộc tính src để thêm tệp bai_hat.mp3 này vào tệp portfolio.html là gì?

Hướng dẫn giải :

Dựa vào thuộc tính của từng tệp, mối quan hệ các tệp để thêm đường dẫn.

Lời giải chi tiết :

Giả sử tập portfolio.html nằm cùng nơi với thư mục Asset. Thư mục Sound, là thư mục con của thư mục Asset, có chứa tệp bai_hat.mp3. Vậy đường dẫn cho thuộc tính src để thêm tệp bai_hat.mp3 này vào tệp portfolio.html như sau:

Asset\ Sound\bai-hat.mp3


Câu hỏi trang 91 Thực hành (TH)

Thêm tệp ảnh vào trang web

Yêu cầu: Trong trang web portfolio.html, hãy thêm 4 hình ảnh theo bố cục như Hình 3.

Hướng dẫn giải :

B1: Khởi động Visual Studio Code và mở tệp portfolio.html.

B2. Viết thêm đoạn mã HTML vào phần mã lệnh của thẻ <body>

B3: Nhảy đúp chuột vào tập portfolio.html để kiểm tra kết quả.

Lời giải chi tiết :

1. Khởi động Visual Studio Code và mở tệp portfolio.html.

2. Viết thêm đoạn mã HTML vào phần mã lệnh của thẻ <body>:

<h1>Nội dung yêu thích/h1>

<h2>Hình ảnh</h2>

<table>

<tr>

<td><img src=”Images/Anh_1.jpg” width=”500″></td> <td><img src=”Images/Anh_2.jpg” width=”500″></td>

</tr>

<tr>

<td><img src=”https://img./picture/2024/0619/iai-tin-hoc-12-bai-f4-trang-89-sgk-chan-troi-sang-tao-1718788266_2.jpg” width=”500″></td> <td><img src=”https://img./picture/2024/0619/iai-tin-hoc-12-bai-f4-trang-89-sgk-chan-troi-sang-tao-1718788266_3.jpg” width=”500″></td>

</tr>

</table>

Em sử dụng thẻ <table> để tạo bố cục hiển thị các hình ảnh gồm có hai thẻ <tr>ứng với hai hàng của bảng, mỗi thẻ <tr> có hai thẻ <td> ứng với hai ô, mỗi ô chứa một hình ảnh. Bên cạnh đó, em thêm tệp ảnh trong thư mục Images nằm cùng nơi với tệp portfolio.html (Anh_1.jpg và Anh_2.jpg) bằng đường dẫn của tệp hoặc thêm tập ảnh từ trang web khác (gY8a62C.jpg và

okIIFRI4.jpg) bằng đường liên kết đến các tệp ảnh đó.

3. Nhảy đúp chuột vào tập portfolio.html để kiểm tra kết quả.


Câu hỏi trang 92 Thực hành (TH)

Yêu cầu: Trong trang web portfolio.html vừa thực hiện ở trên, hãy thêm hai video vẽ hoạt động của lớp.

Hướng dẫn giải :

B1: Viết thêm đoạn mã HTML vào phần mã lệnh của thẻ <body>.

B2: Nháy đúp chuột vào tập portfolio.html để kiểm tra kết quả.

Lời giải chi tiết :

1. Viết thêm đoạn mã HTML vào phần mã lệnh của thẻ <body>:

<h2>Video clip</h2>

<h3>Thi kéo co</h3>

<video src=”Videos/clip_keo_co.mp4″ controls></video>

Em thêm tập video trong thư mục Videos nằm cùng nơi với tệp portfolio.html (clip_keo_comp4) bằng đường dẫn của Tệp hoặc thêm tệp video từ trang web khác bằng đường liên kết đến Tệp đó.

Lưu ý: Các trang web cho phép thêm tệp video theo những cách khác nhau và trình duyệt có thể không hỗ trợ thẻ <video).

2. Nháy đúp chuột vào tập portfolio.html để kiểm tra kết quả.


Câu hỏi trang 92 Vận dụng (VD)

Em hãy bổ sung các nội dung sau vào trang web portfolio.html:

1. Một video clip và một bài hát mà em yêu thích với thẻ <video>,<audio), <h1>, <h2> và các thể khác đã học.

2. Thêm ảnh vào mục Nội dung yêu thích sao cho mỗi hàng của bảng hiển thị ba ảnh, sử dụng thẻ <img>, các thẻ tạo bảng và các thẻ khác đã học.

Hình 4 là một ví dụ kết quả sau khi hoàn thành chỉnh sửa.

image

3. Thêm ảnh đại diện vào bên phải của mục Giới thiệu chung để được kết quả như Hình 5.

image

Hướng dẫn giải :

Dùng các thẻ <video>, <audio>, <img> để thêm ảnh, âm thanh và video vào các vị trí theo yêu cầu.

Sử dụng các thuộc tính phù hợp để chỉnh sửa theo ý.

Lời giải chi tiết :

1. Code như sau:

<!DOCTYPE html>

<html>

<head>

<meta charset=”utf-8″>

<title>Kỉ yếu lớp 12A</title>

</head>

<body>

<h1>Thành viên lớp</h1>

<video src=”D:\Quảng cáo vui nhộn cho bé - Dầu ăn dinh dưỡng Kiddy.mp4″ controls autoplay muted>

Trình duyệt web của bạn có thể không phát được video

</video>

</html>

2. Code như sau:

<!DOCTYPE html>

<html>

<head>

<meta charset=”utf-8″>

<title>Kỉ yếu lớp 12A</title>

</head>

<body>

<h1>Nội dung yêu thích</h1>

<video src=”D:\Quảng cáo vui nhộn cho bé - Dầu ăn dinh dưỡng Kiddy.mp4″ width=”200″controls autoplay muted>

Trình duyệt web của bạn có thể không phát được video

</video>

<p>Nội dung yêu thích</p>

<img src=”D:\40.png” width=”200″ alt=”ảnh chân dung” title=”ảnh chân dung”>

</html>

3. Code như sau:

<!DOCTYPE html>

<html>

<head>

<meta charset=”utf-8″>

<title>Kỉ yếu lớp 12A</title>

</head>

<body>

<h1>Giới thiệu chung</h1>

<p>Họ tên: Nguyễn Văn A</p>

<p>Nơi sinh: Thành phố Hồ Chí Minh</p>

<p>Điện thoại: 09xxxxxxxx</p>

<p>Email: Nguyenvana@gmail.com</p>

<img src=”D:\chan dung.jpg” width=”200″ alt=”ảnh chân dung” title=”ảnh chân dung”>

</html>

image

Dụng cụ học tập

Học Tin học cần sách giáo khoa, máy tính, vở ghi chép, bút mực và phần mềm học tập liên quan.

Chia sẻ

Chia sẻ qua Facebook Chia sẻ

Sách Giáo Khoa: Chân trời sáng tạo

- CHÂN TRỜI SÁNG TẠO là bộ sách giáo khoa hiện đại.

- Bộ sách giáo khoa CHÂN TRỜI SÁNG TẠO sẽ truyền cảm hứng để giúp các em học sinh phát triển toàn diện về tư duy, phẩm chất và năng lực, giúp người học dễ dàng vận dụng kiến thức, kĩ năng vào thực tiễn cuộc sống; giải quyết một cách linh hoạt, hài hoà các vấn đề giữa cá nhân và cộng đồng; nhận biết các giá trị bản thân và năng lực nghề nghiệp mà còn nuôi dưỡng lòng tự hào, tình yêu tha thiết với quê hương đất nước, mong muốn được góp sức xây dựng non sông này tươi đẹp hơn.

Đọc sách

Bạn có biết?

Tin học là môn khoa học nghiên cứu về quá trình tự động hóa thông tin bằng máy tính. Đây là nền tảng của kỷ nguyên số, mở ra những cơ hội mới trong mọi lĩnh vực từ y học đến truyền thông, và đóng vai trò quan trọng trong phát triển kinh tế và xã hội.

Nguồn : Wikipedia - Bách khoa toàn thư

Tâm sự Lớp 12

Lớp 12 - Năm cuối của thời học sinh, với nhiều kỳ vọng và áp lực. Đừng quá lo lắng, hãy tự tin và cố gắng hết sức mình. Thành công sẽ đến với những ai nỗ lực không ngừng!

- Học nhưng cũng chú ý sức khỏe nhé!. Chúc các bạn học tập tốt.

Nguồn : Sưu tập

Copyright © 2024 Giai BT SGK