• Information
• AI Chat

Was this document helpful?

Course: TTSS [TTSS]

59 Documents

Students shared 59 documents in this course

Was this document helpful?

huongct@neu.edu.vn

Bài tập 1-1: Định dạng Text và Images

1. Giới thiệu

Trong bài tập này, SV thực hành tạo trang web sau:

II. Mục tiêu:

✓ Đặt tiêu đề title cho trang

✓ Định dạng trang

✓ Chèn một hình ảnh

✓ Tạo liên kết văn bản và liên kết hình ảnh

✓ Áp dụng các thẻ tiêu đề [heading tags]

✓ Thêm style vào trang sử dụng internal style sheet

✓ Điều chỉnh text wrapping

✓ Thêm và tạo style cho horizontal rule

III. Nội dung thực hành

Tạo trang html mới và đặt tên là ricardo-HotenSV.htm với các yêu cầu sau:

• Page:

o Title tag = Ricardo's Page

o Background Color: red =255, green=200, blue=145

o Text color = Green

• Text styles:

• Home
• My Library
• Ask AI

Uploaded by

Trần Vũ

0% found this document useful [0 votes]

97 views

2 pages

Original Title

Bai Tap HTML Và Css [1]

Copyright

© © All Rights Reserved

Available Formats

DOCX, PDF, TXT or read online from Scribd

Share this document

Did you find this document useful?

Is this content inappropriate?

0% found this document useful [0 votes]

97 views2 pages

Bai Tap HTML Và Css

Uploaded by

Trần Vũ

Jump to Page

You are on page 1of 2

Search inside document

Reward Your Curiosity

Everything you want to read.

Anytime. Anywhere. Any device.

No Commitment. Cancel anytime.

Chào mừng các bạn đến với các bài hướng dẫn về HTML. Sau khi học xong các bài hướng dẫn này các bạn có thể nắm các kiến thức cơ bản HTML, tự mình làm một website. Nếu các bạn biết XML, thì việc học HTML đơn giản hơn. Các bạn không nên đọc các bài hướng dẫn từ đầu đến cuối, nên vừa đọc vừa làm bài thực hành.

• 1. HÀNH HTML Bài 1.01: Tạo trang web có nội dung là Bài tập sử dụng các tag cơ bản Yêu cầu thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Sử dụng các tag cơ bản 2 Nội dung trang web - Sử dụng các tag cơ bản để tạo trang web trên, trong đó:  Dòng đầu tiên: Canh giữa  Đọan văn bản ”Lập trình web ... ngôn ngữ HTML”: Canh giữa Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Dòng 1: Tag

  và thuộc tính [t.t] align để canh giữa - Dòng 2: Tag

  và t.t style[text-decoration] để gạch dưới - Dòng 3: Tag

  hoặc

  và t.t style[font-weight] để in đậm - Đọan văn bản ”Lập trình web ... ngôn ngữ HTML” : Tag

  hoặc

  và t.t align để canh giữa, tag
  để xuống dòng

• 2. trang web có nội dung là Bài tập sử dụng các tag cơ bản, có tô màu cho các đoạn văn bản Yêu cầu thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Sử dụng các tag cơ bản 2 Nội dung trang web Sử dụng các tag cơ bản và thuộc tính của các tag để định dạng: - Dòng dầu tiên: canh giữa, màu xanh lá mạ - Dòng 2: màu xanh dương - Dòng 4 - tựa đề ”MẸ!”: chữ đậm có màu hồng đậm và nền màu hồng nhạt - 3 đọan thơ: in nghiêng, có 3 màu chữ khác nhau - Mỗi đọan cách nhau bởi 1 cây thước ngang - Tòan bộ bài thơ có màu nền là màu vàng nhạt.

  006600

  0000FF

  FF3399,

  FECFFD

  FFFFCC

• 3. Đối tượng Yêu cầu 1 Trang web - Sử dụng tag 2 Nội dung trang web - Dòng 1: Tag

  và t.t align, style[color] để canh giữa và tô màu chữ - Dòng 2: Tag

  và t.t style[text-decoration;color] để gạch dưới và tô màu chữ - Dòng 3: Tag

  hoặc

  và t.t style[font-weight] để in đậm - Dòng 4 - tựa đề ”MẸ!”: Tag

  và t.t align, style[background-color; color; font-weight] để tô màu nền, màu chữ và in đậm - 3 đọan thơ: Tag

  và t.t align, style[font-style; background-color; color] để canh giữa, in nghiêng, tô màu nền, màu chữ; Tag
  đề xuống dòng - Cây thước ngang: Tag và t.t width xác định độ rộng của cây thước. Bài 1.03: Tạo trang web có nội dung là bài viết về Vạn Lý Trường Thành, có định dạng trang web.

• 4. kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Định dạng trang web 2 Nội dung trang web Sử dụng các tag và thuộc tính của tag để định dạng trang web: - Định dạng chung:  Nền: Màu nâu đất  Chữ: Màu trắng  Hình nền: Đặt giữa trang và không di chuyển khi cuộn trang. - Dòng dầu tiên: Canh giữa, màu vàng đậm

  A06D21

  FFFFFF

  FFCC00 Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Định dạng chung: Tag và t.t style[ background-color; color; background-image; background-position; background-repeat ] để định dạng màu nền, màu chữ, hình nền và vị trí hình nền - Dòng dầu tiên: Tag

  và t.t align, style[color] để canh giữa và tô màu chữ Bài 1.04: Tạo trang web có nội dung là bài viết về Lâu đài gỗ ở Pattaya, có định dạng trang web

• 5. kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Định dạng trang web 2 Nội dung trang web Sử dụng các tag và thuộc tính của tag để định dạng trang web: - Định dạng chung:  Nền: Tô đầy trang bằng hình ảnh  Chữ: Màu xanh ve chai đậm - Dòng dầu tiên: Khổ chữ lớn và canh giữa - Đọan văn bản thứ hai: nền màu xanh ve chai, chữ trắng in đậm và nghiêng

  008888

  339999,

  FFFFFF Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Định dạng chung: Tag và t.t style[color; background-image; background-repeat; background-attachment ] để định dạng màu chữ, hình nền - Dòng dầu tiên: Tag

  và t.t align đề canh giữa - Đọan văn bản thứ hai: Tag

  và t.t style[background-color; color; font-weight; font-style] Bài 1.05: Tạo trang web có nội dung được định dạng theo nhiều hình thức.

• 6. kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Định dạng văn bản 2 Nội dung trang web Sử dụng các tag định dạng văn bản để tạo trang web: - Định dạng như hình trên - Dạng công thức hóa học và biểu thức phương trình bậc hai, có chữ màu đỏ - Đọan code vòng lặp For: chữ màu xanh dương đậm, nền màu xám, có định dạng canh lề

  FF0000

  0000CC,

  CCCCCC Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Dòng dầu tiên: Tag

  và t.t align để canh giữa - Dùng tag , để định dạng các cụm từ in đậm và gạch dưới - Dùng tag để định dạng các cụm từ in nghiêng - Dùng tag và t.t color để tô màu chữ đỏ cho các công thức hóa học và phương trình - Dùng tag và đề in các công thức hóa học và phương trình - Dùng tag

   để canh lề cho vòng lặp for và t.t style[background- color; color] để tô màu nền và màu chữ.

• 7. trang web có nội dung là bài viết về Thượng Hải, được định dạng theo nhiều hình thức. Yêu cầu thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Định dạng văn bản 2 Nội dung trang web Sử dụng các tag định dạng văn bản và các thuộc tính định dạng để tạo trang web: - Định dạng như hình trên - Đọan văn đầu: canh lề trái - Dòng Bến Thượng Hải: canh lề phải, size=20px - Đọan văn cuối: canh lề phải Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Tiêu đề: Tag

  và t.t align, style [color; border] - Đọan văn đầu: Tag và t.t face, size, color - ”Điểm nóng nhất của Trung Hoa hiện đại” : Tag và - Dòng Bến Thượng Hải: Tag

  và t.t align, style [background- color;color;font-weight;font-size] - Đọan cuối: Tag

  và t.t align, tag và t.t face, size, color, style[background-color], tag ,

• 8. trang web có nội dung là thông tin về Công ty Hoa tươi Nhân Ái, được định dạng theo nhiều hình thức Yêu cầu thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Ký tự đặc biệt, chèn hình ảnh, tạo danh sách và liên kết 2 Nội dung trang web Sử dụng các tag định dạng và các thuộc tính định dạng để tạo trang web: - Định dạng như hình trên - Khi nhấn chuột vào dòng ”Trung Tâm Tin Học ...” : Mở trang web của TTTH – //www.csc.hcmuns.edu.vn Hướng dẫn giải: Stt Đối tượng Hướng dẫn cài đặt 1 Trang web - Sử dụng tag 2 Nội dung trang web - Tiêu đề: Tag

  và t.t align, style [color] - Hình: Tag

  19. web xem nội dung các bài tập về ngôn ngữ HTML Yêu cầu thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Tạo iframe 2 Nội dung trang web - Tạo 1 table chứa nội dung trên, trong đó:  Ô đầu: Chứa nội dung tiêu đề  Ô bên trái: Chứa thực đơn bài tập, mỗi dòng liên kết đến trang web bài tập tương ứng  Ô bên phải: Thể hiện nội dung các trang tương ứng với thực đơn được chọn. Mặc định là trang Bai 2.1.html Yêu cầu xử lý: Stt Đối tượng Yêu cầu Ghi chú 1 Thực đơn bài tập - Khi chọn: Thể hiện nội dung trang web tương ứng trong ô bên phải Hướng dẫn giải: Stt Đối tượng Thiết kế 1 Trang web - Sử dụng tag 2 Nội dung trang web - Tạo table gồm 2 dòng, 2 cột - Ô bên trái: Tag và t.t href, target - Ô bên phải: Tag và t.t src="Bai 2.1.html", width, height, name

  20. trang web có nội dung là các chuyên mục thắc mắc

  21. thiết kế: Stt Đối tượng Yêu cầu Hằng số màu 1 Trang web - Tiêu đề cửa sổ: Bài tập tổng hợp 2 Nội dung trang web - Tạo 1 table chứa nội dung trên, trong đó: + Dòng đầu: Chứa nội dung tiêu đề và hình ảnh + Ô bên trái: Chứa thực đơn các chuyên mục, mỗi dòng liên kết đến mục tương ứng với các ô bên phải + Ô bên phải: Thể hiện các nội dung chi tiết của từng chuyên mục. Yêu cầu xử lý: Stt Đối tượng Yêu cầu Ghi chú 1 Thực đơn các chuyên mục - Khi chọn, di chuyển đến mục tương ứng trong ô bên phải 2 Về đầu trang - Khi chọn, di chuyển về đầu trang web Hướng dẫn giải: Stt Đối tượng Thiết kế 1 Trang web - Sử dụng tag 2 Nội dung trang web - Tạo table gồm 15 dòng, 2 cột - Dòng đầu: Tag và t.t src, align, style="z-index:-1; position:absolute". Tag và t.t name="

  vedau" để đánh dấu vị trị đầu trang - Ô bên trái: Tag và t.t href - Ô bên phải: + Các dòng tiêu đề của chuyên mục ta dùng và t.t name để khai báo tên chuyên mục + Nội dung chi tiết: tag , ,

  ,
  • + ”Về đầu trang”: tag và t.t href