Bài trước chúng ta đã học đến thẻ p và đang dừng lại ở ví dụ, trong bài này các thắc mắc như làm sao để in đậm, in nghiêng, nổi bật tiêu đề, tô màu theo ý mình.
Có 6 thẻ cho 6 dạng tiêu đề khác nhau: h1, h2, h3, h4, h5, h6, kích thước tiêu đề sẽ giảm dần từ h1 đến h6.
ví dụ:
4. Thẻ Body và các thẻ nằm trong Body ( tiếp theo).
a. Thẻ p ( đã học bài trước)
b. Thẻ h, b, i,u.
- Thẻ h: là thẻ xác định tiêu đề cho website.Có 6 thẻ cho 6 dạng tiêu đề khác nhau: h1, h2, h3, h4, h5, h6, kích thước tiêu đề sẽ giảm dần từ h1 đến h6.
ví dụ:
Dùng thẻ tiêu đề h1, h2, h6 cho trang web
Trình duyệt hiển thị
- Thẻ b: In đậm chữ.
- Thẻ i: in nghiêng chữ.
- Thẻ u: gạch chân chữ.
Ví dụ:
Sử dụng các thẻ h, b, u, i
Trình duyệt hiển thị
c.Thẻ font:
Là thẻ được dùng khá nhiều trong html, có chức năng định kích thước, font chữ, màu chữ cho văn bản html.
Thuộc tính cho kích thước là size: nhận giá trị từ 1 -> 7
Thuộc tính cho phông chữ là font: nhận giá trị là tên các font chữ tiếng anh ( arial, time new roman...)
Thuộc tính cho màu chữ là color: nhận các giá trị là tên màu tiếng anh hoặc bảng mã màu hệ 16.
Ví dụ: Định dạng cho từ "thiet ke giao dien web" có kích thước là 5, font là Arial, màu đỏ.
Định dạng cho từ thiết kế giao diện web thứ 2
Hiển thị trên trình duyệt
d. Chèn hình ảnh trong HTML.
Dùng để chèn phần tử là hình ảnh vào trang web.
Cú pháp:
<img src="hinhanh.tenmorong" alt="giatri" title="giatri" width="gia_tri" hight="gia_tri" />
Thuộc tính:
src: nhận giá trị là đường dẫn tới file hình ảnh cần hiển thị.
Có thể là đường dẫn tương đối, có thể là đường dẫn tuyệt đối.
alt: sẽ hiển thị giá trị của thuộc tính này nếp hình ảnh không tồn tại ( có thể là do link die, bị xóa ở nguồn...).
title: giá trị văn bản, sẽ hiển thị khi di chuột vào.
witdh, heigh : độ rộng và chiều cao, bạn có thể xét độ cao tùy ý, nếu không thì trình duyệt sẽ hiển thị kích thước gốc của hình ảnh.
Ví dụ: Chèn banner dịch vụ thiết kế web bất động sản của công ty OSVN - Company Limited.
Chèn banner
Trình duyệt hiển thị banner thiet ke web bat dong san
Thông thường, các bạn thấy trên banner của các diễn đàn, blog khi chúng ta click vào banner đó thì trình duyệt sẽ đưa chúng ta về một liên kết chứa thông tin liên quan đến hình ảnh đó. Để làm được điều đó chúng ta cần chèn liên kết qua HTML.
e. Chèn liên kết trong HTML (link).
Để gải quyết vấn đề trong phần d ta cần dùng đến thẻ a để chèn một liên kết vào html.
Cú pháp:<a href="duong_dan_can_den" target="gia_tri">Văn bản đại diện cho đường dẫn cần đến</a>
Thuộc tính:
href: nhận giá trị là link cần đến.
target: thuộc tính này quy định các liên kết được mở ra như thế nào
+ _blank : sẽ mở liên kết cần trỏ tới trong tab mới trên trình duyệt.
+ seft: sẽ mở ở cửa sổ hiện tai ( mặc định).
Ví dụ: Chèn link cho cụm từ "website giá rẻ", trỏ đến link sau: http://ithietkeweb.net, link trỏ đến sẽ hiển thị ngay trên cửa sổ hiện tại.
Chèn link
Trình duyệt hiển thị
Khi click vào chữ đó tương tự như click vào chữ này : website giá rẻ
Bài tập thực hành:
Tạo một file HTML trong đó có các nội dung sau:
Một đoạn văn giới thiệu về du học hàn quốc , tiêu đề của đoạn văn này là Du Học Hàn Quốc Cùng OSC ,
nội dung tùy chọn, dùng thẻ h cho tiêu đề.
Chèn 1 hình ảnh về dịch vụ thiết kế web bất động sản của OSVN Company Limited.
Link hình ảnh : http://www.uphinhnhanh.com/images/59416slide1.jpg
Tải hình ảnh về lưu trên máy và sử dụng đường dẫn tương đối.
Khi click vào hình ảnh trên sẽ trỏ đến link sau: http://ithietkeweb.net/thiet-ke-web-bat-dong-san-cua-osvn/
Bài tiếp theo chúng ta sẽ học về thẻ table ( tạo bảng): Bài 3: Thẻ Table
0 nhận xét:
Đăng nhận xét