Thuộc Tính Vertical-align | CSS - Học Web Chuẩn

Trang chủ » Câu Lệnh Th Valign= Hướng Có ý Nghĩa Là Gì » Thuộc Tính Vertical-align | CSS - Học Web Chuẩn

Có thể bạn quan tâm

Thuộc tính vertical-align
  • Trang chủ
  • Tham khảo
  • CSS
  • Thuộc tính vertical-align

Định nghĩa và sử dụng

Thuộc tính vertical-align sắp xếp các nội dung theo chiều dọc.

Cấu trúc

tag { vertical-align: giá trị; }

Với giá trị như sau:

Thuộc tính giá trị Ví dụ Mô tả
vertical-align Khoảng cách vertical-align: 10px; Xác định khoảng cách cho thành phần, có thể dùng số âm.
baseline vertical-align: baseline; Đây là dạng cơ bản, mặc định, các thành phần đều nằm theo cùng đường cơ bản (baseline).
sub vertical-align: sub; Canh lề thành phần giống như sử dụng subscript.
super vertical-align: super; Canh lề thành phần giống như sử dụng superscript.
top vertical-align: top; Canh phần trên cùng của thành phần theo phần trên cùng cao nhất của các thành phần trong cùng hàng.
text-top vertical-align: rtl; Canh phần trên cùng của thành phần theo phần trên cùng cao nhất của text của thành phần bao ngoài.
middle vertical-align: middle; Thành phần sẽ được canh giữa theo thành phần bao ngoài.
bottom vertical-align: bottom; Canh phần dưới cùng của thành phần theo phần dưới cùng thấp nhất của các thành phần trong cùng hàng.
text-bottom vertical-align: text-bottom; Canh phần dưới cùng của thành phần theo phần dưới cùng thấp nhất của text của thành phần bao ngoài.
inherit vertical-align: inherit; Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài).

Ví dụ

Xem thêm ví dụ

HTML viết:

<html> <head></head> <body> <p>HỌC WEB CHUẨN <span>thì dễ<span></p> </body> </html>

Hiển thị trình duyệt khi chưa có CSS:

HỌC WEB CHUẨN thì dễ

CSS viết:

p span { vertical-align: super; }

Hiển thị trình duyệt khi có CSS:

HỌC WEB CHUẨN thì dễ

Trình duyệt hỗ trợ

  • Internet Explorer
  • Firefox
  • Opera
  • Google Chrome
  • Safari

Thuộc tính vertical-align được hỗ trợ trong đa số các trình duyệt.

Giá trị "inherit" không hỗ trợ trình duyệt IE7 trở xuống, IE8 đòi hỏi phải có !Doctype

Link liên quan

  • HTML/XHTML
  • CSS
  • class
  • <html></html>
  • <head></head>
  • <body></body>
  • <p></p>
  • <span></span>

top

visibility

CSS

HƯỚNG DẪN HỌC

  • Hướng dẫn học
  • Hướng dẫn học XHTML & HTML5
  • Hướng dẫn học CSS
  • Hướng dẫn học CSS3
  • Hướng dẫn học Responsive
  • Hướng dẫn học ES6
  • Hướng dẫn học React.js
  • Hướng dẫn học jQuery
  • Hướng dẫn học PHP
  • Hướng dẫn học Laravel
  • Hướng dẫn học Wordpress
  • Hướng dẫn học Webpack
  • Hướng dẫn học SCSS

THAM KHẢO

Thuộc tính CSS

  • background
  • border
  • border-collapse
  • border-spacing
  • bottom
  • caption-side
  • clear
  • clip
  • color
  • content
  • counter-increment
  • counter-reset
  • cursor
  • direction
  • display
  • empty-cells
  • float
  • font
  • height
  • left
  • letter-spacing
  • line-height
  • list-style
  • margin
  • max-height
  • max-width
  • min-height
  • min-width
  • outline
  • overflow
  • padding
  • page-break-after
  • page-break-before
  • page-break-inside
  • position
  • quotes
  • right
  • table-layout
  • text-align
  • text-decoration
  • text-indent
  • text-transform
  • top
  • vertical-align
  • visibility
  • white-space
  • width
  • word-spacing
  • z-index

Tham khảo CSS

  • CSS - Tham khảo
  • CSS - Bộ chọn (selectors)
  • CSS - Thuộc tính
  • CSS3 - Tham khảo
  • CSS3 - Bộ chọn (selectors)
  • CSS3 - Thuộc tính
  • Xem thêm ví dụ về CSS

Tham khảo HTML/XHTML

  • Tham khảo HTML/XHTML
  • Tag theo function
  • Tag theo giá trị DTD
  • Tham khảo HTML4/XHTML
  • Tham khảo HTML5
  • Xem thêm ví dụ về HTML

Tham khảo JQUERY

  • jQuery - Tham khảo
  • jQuery - Cài đặt và sử dụng
  • jQuery - Bộ chọn (selectors)
  • jQuery - Hàm (function)
  • jQuery - Ajax

Tham khảo Thêm

  • Lang codes
  • Font chữ
  • Mã ký tự
  • MIME
  • Đơn vị trong HTML & CSS
  • Giá trị màu trong HTML & CSS
  • Thuộc tính tổng quát

CHUYÊN ĐỀ

  • Chuyên đề
  • Chuyên đề HTML/CSS
  • Chuyên đề HTML5/CSS3
  • Chuyên đề jQuery/JS
  • jQuery/JS plugin

Góp ý - Liên hệ

  • CÔNG CỤ TẠO CSS3CSS3 GENERATOR
  • BỘ CÔNG CỤGENERATOR TOOLS
  • CÔNG CỤ HỖ TRỢWEB TOOLS
  • CÔNG CỤ TẠO RANDOMRANDOM GENERATOR
  • CÔNG CỤ KIỂM TRA RESPONSIVE TEST
  • CHIA SẺ HAYWEB & TOOLS
  • Follow us on hocwebchuan.com
  • Short URL
  • Rabbie theme

Từ khóa » Câu Lệnh Th Valign= Hướng Có ý Nghĩa Là Gì