Một số thẻ đặc biệt

1. Thẻ <meta>

Thẻ <meta> được khái báo trong cặp thẻ <head>, thẻ <meta> thường được sử dụng để khái báo loại font sử dụng, tìm kiếm, xóa cache, chuyển trang…

a. Thẻ <meta> với font

Để sử dụng font Unicode đặc biệt Unicode tiếng việt trên trang web, chúng ta phải khai báo thẻ <meta> trong thẻ <head>.

b. Thẻ <meta> cho phép người dùng tìm kiếm.

Khi bạn đưa trang web của bạn lên internet, để người dùng có thể tìm thấy web site của bạn qua các công cụ trên như: Google, Yahoo …, khi đó chúng ta khai báo thẻ <meta> như sau

Bạn có thể khái báo các thông tin khác của trang web để khi người dùng có thể tìm kiếm thông qua các thông tin này.

<META NAME = “keywords” CONTENT = “Công thương, kỹ thuật công nghiệp 2. ….. ”> Các từ khóa này sẽ được đem so sánh với các từ khóa người dùng gõ và tìm kiếm trên Internet, nếu từ khóa người dùng tìm kiếm thuộc một trong số từ khóa của bạn đã khai báo trong thẻ này, web site của bạn sẽ được xuất hiện trong danh sách tìm kiếm được.

c. Thẻ <meta> dạng tự động chuyển đến URL

Để tự động chuyển đến địa chỉ URL hay UNC kế tiếp sau khi trang web nạp lên với thời gian nhất định, bạn có thể khái báo trong thẻ JavaScript.

Ví dụ:

<title>Welcome to PHP and MySQL</title>

</head>

Trang này tự động chuyển đến trang <b>www.saigoninfotech.com</b> sau 8 giây </body>

</html>

d. Thẻ <meta> dùng xóa cache

Thông thường sau khi nạp trang web nào đó lên trình duyệt web, nội dung của trang web đó có thẻ lưu vào trong bộ nhớ truy cập nhanh (cache).

Điều này có nghĩa là sau khi duyệt một vòng các trang web khác, bạn quay về gọi trang web đã truy cập trước đó, trình duyệt web nạp rất nhanh, do chúng đã lưu trang trong bộ nhớ cache.

Tuy nhiên, khi bạn là người phát triển ứng dụng web, có những trang web bạn phải xóa cache mỗi khi người dùng gọi nó. Nghĩa là, trang web này thường có thay đổi cấu trúc cho mỗi lần gọi, bạn cần khai báo thẻ <meta> như ví dụ sau:

Ví dụ:

<title>Welcome to PHP and MySQL</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="expires" content="0">

<body bgcolor="#ffffff"> Xoa Cache </body>

</html>

2. Thẻ <marquee>

Thẻ <marquee> cho phép bạn khái báo một chuổi chuyển động theo chiều hướng khác nhau trên trang web. Thẻ này thường được sử dụng để quảng cáo một đề tài nào đó.

Có 4 chiều di chuyển của chuổi, bạn có thể khái báo tùy thuộc vào các tham số UP, DOWN, BACK, RIGHT của thuộc tính DIRECTION.

Ví dụ:

<title>Welcome to php and mysql</title> </head>

<body>

<br>ashley- ana - chanthaly - kathleen - lena </marquee><br> <marquee direction=up scrolldelay=2 scrollamount=1 width=100%

style="filter:wave(add=5, phase=1, freq=5, strength=20);"><font face="arial" size="1" color=#ff33ff> <br>ashley <br>ana <br>chanthaly <br>kathleen <br>lena </marquee> </body> </html> 3. Thẻ <style>

Thẻ <style> cho phép bạn định dạng tất cả nội dung trình bày trên trang web theo một kiểu nhất định. Điều này có nghĩa là mọi thẻ trên trang web có khai báo sử dụng một phần tử nào đó được khái báo thẻ <style>, chúng sẽ có kiểu định dạng như bạn định nghĩa.

Bạn khái báo thẻ <style> trong thẻ <head>.

<style>

background-image: url(“hinhnen.gif”); background-repeat: no-repeat;

</style>

4. Thẻ <link>

Khi khai báo các phần tử trong trang style.css, bạn có thể khái báo chúng trong một trang web bằng thẻ <link>. Để sử dụng bạn cũng khái báo như trường hợp sử dụng phần tử trong ví dụ sau:

Ví dụ: Chèn tyle.css vào trong tài liệu html

5. Thẻ <script>

Trong trang web, bạn muốn kiểm soát tất cả các hành động của người dùng, bạn cần khái báo vá sử dụng một số phương thức và thuộc tính của Client Script hay các phương thức do bạn định nghĩa.

Để có thể khái báo kịch bản trên trang web, bạn sử dụng thẻ <script> với tên ngôn ngữ chỉ định JavaScript hay VBScript.

Cú pháp:

Ngoài ra trong trường hợp có nhiều phương thức do bạn định nghĩa được sử dụng chung trong nhiều trang web, bạn cũng có thể khai báo chúng trong một tập tin có tên mở rộng .js hay .vb. Sau đó bạn có thẻ chèn tập tin này và sử dụng như cách chèn trực tiếp.

Chương 3: Thiết kế CSS I. Giới thiệu về CSS

CSS (Cascading Style Sheets) được hiểu một cách đơn giản đó là cách mà chúng ta thêm các kiểu hiển thị (font chữ, kích thước, màu sắc...) cho một tài liệu Web

Một số đặc điểm của Cascading Style Sheets:

- CSS quy định cách hiển thị của các thẻ HTML bằng cách quy định các thuộc tính của các thẻ đó (font chữ, màu sắc). Để cho thuận tiện bạn có thể đặt toàn bộ các thuộc tính của thẻ vào trong một file riêng có phần mở rộng là ".css"

- CSS nó phá vỡ giới hạn trong thiết kế Web, bởi chỉ cần một file CSS có thể cho phép bạn quản lí định dạng và layout trên nhiều trang khác nhau. Các nhà phát triển Web có thể định nghĩa sẵn thuộc tính của một số thẻ HTML nào đó và sau đó nó có thể dùng lại trên nhiều trang khác.

- Có thể khai báo CSS bằng nhiều cách khác nhau. Bạn có thể đặt đoạn CSS của bạn phía trong thẻ <head>...</head>, hoặc ghi nó ra file riêng với phần mở rộng ".css", ngoài ra bạn còn có thể đặt chúng trong từng thẻ HTML riêng biệt

- Tuy nhiên tùy từng cách đặt khác nhau mà độ ưu tiên của nó cũng khác nhau. Mức độ ưu tiên của CSS sẽ theo thứ tự sau.

Style đặt trong từng thẻ HTML riêng biệt Style đặt trong phần <head>

Style đặt trong file mở rộng .css Style mặc định của trình duyệt

Mức độ ưu tiên sẽ giảm dần từ trên xuống dưới.

CSS có tính kế thừa: giả sử rằng bạn có một thẻ <div id="vidu"> đã được khai báo ở đầu file css với các thuộc tính như sau:

#vidu {

width: 200px; height: 300px; }

Ở một chỗ nào đó trong file css bạn lại khai báo một lần nữa thẻ <div id="vidu"> với các thuộc tính. #vidu { width: 400px; background-color: #CC0000; }

Sau đoạn khai báo này thì thẻ <div id="vidu"> sẽ có thuộc tính: #vidu {

width: 400px; /* Đè lên khai báo cũ */ height: 300px;

background-color: #CC0000; }

II. Cú pháp

1. Định dạng thuộc tính thẻ html

Các thuộc tính của thẻ html không được phong phú và đa dạng do vậy chúng ta có thể thay đổi lại thuộc tính mặc định của thẻ. Chúng ta có thể định dạng các thẻ ngay trên tài liệu html bằng thẻ <style> hoặc được định dạng trong một tập tin khác sau đó chèn vào tài liệu html. Cú pháp: name_tag { property_1: values; property_2: values; … } Ví dụ: Định dạng hình nền và các thuộc tính khác body { background-image: url(“images\background_image.gif”); background-repeat: no-repeat; } 2. Định dạng một kiểu mới

Chúng ta có thể định dạng một kiểu riêng trong tài liệu html hoặc trong một tập tin riêng. Sau đó đưa định dạng đó vào trong thể html bằng thuộc tính class của thẻ.

Cú pháp: .name_style { property_1: values; property_2: values; … }

Ví dụ: Định dạng thuộc tính hình nền trang web

. mystyle {

background-image: url(“images\background_image.gif”); background-repeat: no-repeat;

}

Sau đó, ta áp dụng định dạng trên vào thẻ <body class= “mystyle”> …

<body class= “mystyle”> …

b. Kiểu được chèn vào thẻ html bằng thuộc tính id của thẻ

Chúng ta có thể định dạng một kiểu riêng trong tài liệu html hoặc trong một tập tin riêng. Sau đó đưa định dạng đó vào trong thể html bằng thuộc tính Id của thẻ.

Cú pháp: # name_style { property_1: values; property_2: values; … }

Ví dụ: Định dạng thuộc tính hình nền trang web

# mystyle {

background-image: url(“images\background_image.gif”); background-repeat: no-repeat;

Sau đó, ta áp dụng định dạng trên vào thẻ <body id= “mystyle”> …

<body id= “mystyle”> …

3. Định dạng ngay trong thẻ html

Ngoài các cách trên, chúng ta có thể định dạng kiểu trên thẻ html. Cú pháp:

<name_tag style= “property_1:values [; property_2: values; …] ”>

</name_tag>

Ví dụ:

<body style="background-image:url(anh_nen.JPG); background-repeat:no-repeat"> Nội dung tài liệu html

</body>

Các thẻ chèn âm thanh, hình ảnh

Các thẻ chèn âm thanh, hình ảnh