inline

span là phần tử cùng dòng tiêu chuẩn. Một phần tử cùng dòng có thể "gói" text trong một đoạn văn <span> như này</span> mà không ảnh hưởng tới đặc tính về vị trí của đọan văn đó. Thẻ a là một trong số những thẻ cùng dòng thường dùng nhất, khi bạn sẽ dẫn link với thẻ này. Nói một cách nôm na thì các phần tử (thẻ) nào mặc định là inline, khi xếp bên nhau, thay vì như hai viên gạch chồng lên nhau, chúng giống như hai toa tầu của một đoàn tầu ghép vào nhau.

none

Chú ý rằng display còn có thể thiết lập là none. Một số phần tử đặc biệt như script có giá trị mặc định này. Trên thực tế, người ta hay dùng JavaScript để ẩn hoặc hiện một đối tượng nào đó, bằng việc thay đổi giá trị của display, thay vì thực sự xóa hoặc tạo lại một phần tử HTML nào đấy.

Chú ý nữa là thuộc tính display khác với thuộc tính visibility. Thiết lập display thành none sẽ render trang web theo kiểu element HTML không tồn tại. Trong khi đó, khi thiết lập visibility: hidden;, phần tử HTML đó sẽ bị ẩn, nhưng nó vẫn chiếm không gian của trang, như lúc nó hiển thị vậy.

Các giá trị khác của thuộc tính display

Có khá nhiều các giá trị khác cho thuộc tính display , chẳng hạn như: list-item và table. Xem thêm tại đây. Chúng ta sẽ thảo luận về inline-block và flex sau này. Hiện nay, xu thế mới nhất là dùng grid.

thêm tí hành tỏi:

Chú ý rằng tất cả các thẻ đều có giá trị display mặc định, nhưng chúng ta luôn luôn ghi đè được. Tất nhiên, sẽ khá là dzô dziên nếu ép kiểu của div sang dạng inline, nhưng trong những tình huống cụ thể, chúng ta có thể linh hoạt thiết lập. Một tình huống khá quen thuộc là chúng ta thiết lập thẻ li thành dạng inline cho các elements của menu dạng thẳng đứng.