1. Trang chủ
  2. » Rèn nghị lực – học làm người

Giáo trình Thiết kế Web - Nguyễn Hữu Tuấn

7 5 0

Đang tải... (xem toàn văn)

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 7
Dung lượng 331,36 KB

Nội dung

[r]

(1)

PHẦN I GIỚI THIỆU NGÔN NGỮ HTML

I CÁC THẺ ĐỊNH CẤU TRÚC TÀI LIỆU 1.1 HTML

Cặp thẻ sử dụng để xác nhận tài liệu tài liệu HTML, tức có sử dụng thẻ HTML để trình bày Tồn nội dung tài liệu đặt cặp thẻ Cú pháp: <HTML>

Toàn nội tài liệu đặt ởđây </HTML>

Trình duyệt xem tài liệu không sử dụng thẻ <HTML> tệp tin văn bình thường

1.2 HEAD

Thẻ HEAD dùng để xác định phần mởđầu cho tài liệu Cú pháp:

1.3 TITLE

<HEAD>

Phần mởđầu (HEADER) tài liệu đặt ởđây </HEAD>

Cặp thẻ sử dụng phần mởđầu tài liệu, tức phải nằm thẻ phạm vi giới hạn cặp thẻ<HEAD>

Cú pháp:

<TITLE>Tiêu đề tài liệu</TITLE> 1.4 BODY

Thẻ sử dụng để xác định phần nội dung tài liệu - phần thân (body) tài liệu Trong phần thân chứa thông tin định dạng định đểđặt ảnh cho tài liệu, màu nền, màu văn siêu liên kết, đặt lề cho trang tài liệu Những thông tin đặt phần tham số thẻ

(2)

<BODY>

phần nội dung tài liệu đặt ởđây </BODY>

Cú pháp:

Trên cú pháp thẻ BODY, nhiên HTML 3.2 có nhiều thuộc tính sử dụng thẻ BODY Sau thuộc tính chính:

BACKGROUND= Đặt ảnh làm ảnh (background) cho

văn Giá trị tham số (phần sau dấu bằng) URL file ảnh Nếu kích thước ảnh nhỏ cửa sổ trình duyệt tồn hình cửa sổ trình duyệt sẽđược lát kín nhiều ảnh

BGCOLOR= Đặt mầu cho trang hiển thị Nếu hai tham

sốBACKGROUND BGCOLOR có giá trị

trình duyệt hiển thị mầu trước, sau tải ảnh lên phía

TEXT= Xác định màu chữ văn bản, kể đề mục

ALINK=,VLINK=,LINK= Xác định màu sắc cho siêu liên kết văn

bản Tương ứng, alink (active link) liên kết kích hoạt - tức kích chuột lên; vlink (visited link) liên kết kích hoạt;

Như tài liệu HTML có cấu trúc sau: <HTML>

<HEAD>

<TITLE>Tiêu đề tài liệu</TITLE> </HEAD>

<BODY Các tham số có>

Nội dung tài liệu </BODY>

</HTML>

II CÁC THẺ ĐỊNH DẠNG KHỐI 2.1 THẺ P

Thẻ<P> sử dụng đểđịnh dạng đoạn văn Cú pháp:

<P>Nội dung đoạn văn bản</P>

(3)

2.2 CÁC THẺ ĐỊNH DẠNG ĐỀ MỤC H1/H2/H3/H4/H5/H6

HTML hỗ trợ mức đề mục Chú ý đề mục dẫn định dạng mặt logic, tức trình duyệt thể đề mục khn dạng thích hợp Có thể trình duyệt font chữ 14 point sang trình duyệt khác font chữ 20 point Đề mục cấp cao giảm dần đến cấp Thông thường văn ởđề mục cấp hay cấp thường có kích thước nhỏ văn thơng thường

Dưới thẻ dùng đểđịnh dạng văn dạng đề mục: <H1> </H1> Định dạng đề mục cấp <H2> </H2> Định dạng đề mục cấp <H3> </H3> Định dạng đề mục cấp <H4> </H4> Định dạng đề mục cấp <H5> </H5> Định dạng đề mục cấp <H6> </H6> Định dạng đề mục cấp 2.3 THẺ XUỐNG DỊNG BR

Thẻ khơng có thẻ kết thúc tương ứng (</BR>), có tác dụng chuyển sang dòng Lưu ý, nội dung văn tài liệu HTML trình duyệt Web thể liên tục, khoảng trắng liền nhau, ký tự tab, ký tự xuống dòng coi khoảng trắng Để xuống dòng tài liệu, bạn phải sử dụng thẻ<BR>

2.4 THẺ PRE

Để giới hạn đoạn văn định dạng sẵn bạn sử dụng thẻ<PRE> Văn hai thẻ thể giống hệt chúng đánh vào, ví dụ dấu xuống dịng đoạn văn giới hạn thẻ<PRE> có ý nghĩa chuyển sang dịng (trình duyệt khơng coi chúng dấu cách)

Cú pháp:

Giáo trình thiết kế Web

III CÁC THẺ ĐỊNH DẠNG DANH SÁCH 3.1 DANH SÁCH THÔNG THƯỜNG

<PRE>Văn định dạng</PRE>

<UL>

<LI> Mục thứ <LI> Mục thứ hai </UL>

(4)

Có kiểu danh sách:

•` Danh sách không xếp ( hay không đánh số) <UL>

• Danh sách có xếp (hay có đánh số) <OL>, mục da nh sách xếp thứ tự

• Danh sách thực đơn <MENU> • Danh sách phân cấp <DIR>

Với nhiều trình duyệt, danh sách phân cấp danh sách thực đơn giống danh sách khơng đánh số, dùng lẫn với Với thẻ OL ta có cú pháp sau:

trong đó:

TYPE =1 Các mục xếp theo thứ tự 1, 2, =a Các mục xếp theo thứ tự a, b, c =A Các mục xếp theo thứ tự A, B, C =i Các mục xếp theo thứ tự i, ii, iii =I Các mục xếp theo thứ tự I, II, III Ngồi cịn thuộc tính START= xác định giá trị khởi đầu cho danh sách

Thẻ < LI > có thuộc tính TYPE= xác định ký hiệu đầu dòng (bullet) đứng trước mục danh sách Thuộc tính nhận giá trị : disc (chấm trịn đậm); circle (vịng trịn); square (hình vng)

IV CÁC THẺ ĐỊNH DẠNG KÝ TỰ 4.1 CÁC THẺ ĐỊNH DẠNG IN KÝ TỰ

Sau thẻđược sử dụng để quy định thuộc tính in nghiêng, in đậm, gạch chân cho ký tự, văn thể trình duyệt

Giáo trình thiết kế Web

<B> </B>

<STRONG> </STRONG>

In chữđậm <I> </I>

<EM> </EM>

In chữ nghiêng <U> </U> In chữ gạch chân

<DFN> Đánh dấu đoạn văn hai thẻ <OL TYPE=1/a/A/i/I>

(5)

Giáo trình thiết kế Web định nghĩa từ Chúng thường in nghiêng thể qua kiểu đặc biệt

<S> </S>

<STRIKE> </STRIKE>

In chữ bị gạch ngang

<BIG> </BIG> In chữ lớn bình thường cách tăng kích thước font thời lên Việc sử dụng thẻ <BIG>lồng tạo hiệu ứng chữ tăng dần Tuy nhiên trình duyệt có giới hạn kích thước font chữ, vượt giới hạn này, thẻ <BIG> khơng có ý nghĩa

<SMALL> </SMALL> In chữ nhỏ bình thường cách giảm

kích thước font thời Việc sử dụng thẻ <SMALL>lồng tạo hiệu ứng chữ giảm dần Tuy nhiên trình duyệt có giới hạn kích thước font chữ, vượt giới hạn này, thẻ

<SMALL> khơng có ý nghĩa

<SUP> </SUP> Định dạng số (SuperScript)

<SUB> </SUB> Định dạng số (SubScript)

<BASEFONT> Định nghĩa kích thước font chữđược sử dụng

cho đến hết văn Thẻ có tham số size= xác định cỡ chữ Thẻ <BASEFONT> khơng có thẻ kết thúc

<FONT> </FONT> Chọn kiểu chữ hiển thị Trong thẻ đặt hai tham số size= color= xác định cỡ chữ màu sắc đoạn văn nằm hai thẻ Kích thước tuyệt đối (nhận giá trị từ đến 7) tương đối (+2,-4 ) so với font chữ

4.2 CĂN LỀ VĂN BẢN TRONG TRANG WEB

Trong trình bày trang Web bạn phải ý đến việc lề văn để trang Web có bố cục đẹp Một số thẻđịnh dạng P, Hn, IMG có tham số ALIGN cho phép bạn lề văn nằm phạm vi giới hạn thẻđó

Các giá trị cho tham số ALIGN:

LEFT Căn lề trái CENTER Căn trang RIGHT Căn lề phải

(6)

Giáo trình thiết kế Web 32

PHẦN I

GIỚI THIỆU NGÔN NGỮ HTML

I CÁC THẺĐỊNH CẤU TRÚC TÀI LIỆU

1.1 HTML

1.2 HEAD

1.3 TITLE

1.4 BODY

II CÁC THẺĐỊNH DẠNG KHỐI

2.1 thẻ P

2.2 Các thẻđịnh dạng đề mục H1/H2/H3/H4/H5/H6

2.3 Thẻ xuống dòng BR

2.4 Thẻ PRE

III CÁC THẺĐỊNH DẠNG DANH SÁCH

3.1 Danh sách thông thường

IV CÁC THẺĐỊNH DẠNG KÝ TỰ

4.1 Các thẻđịnh dạng in ký tự

4.2 Căn lề văn trang Web

4.3 Các ký tựđặc biệt

4.4 Sử dụng màu sắc thiết kế trang Web

4.5 Chọn kiểu chữ cho văn

4.6 Khái niệm văn siêu liên kết

4.7 Địa tương đối

4.8 Kết nối mailto 10

4.9 Vẽ đường thẳng nằm ngang 10

V CÁC THẺ CHÈN ÂM THANH, HÌNH ẢNH 11

5.1 Giới thiệu 11

5.2 Đưa âm vào tài liệu HTML 12

5.3 Chèn hình ảnh, đoạn video vào tài liệu HTML 13

VI CÁC THẺĐỊNH DẠNG BẢNG BIỂU 14

VII FORM 15

7.1 HTML Forms 15

7.2 Tạo Form 15

7.3 Tạo danh sách lựa chọn 16

(7)

Giáo trình thiết kế Web 33

Ngày đăng: 09/03/2021, 03:26

w