masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu

Paparan dan Keterlihatan CSS

Paparan dan Keterlihatan CSS

Elemen tersembunyi - paparan:tiada Atau keterlihatan:tersembunyi

Atribut paparan menetapkan cara elemen dipaparkan dan atribut keterlihatan menetapkan keterlihatan elemen paparan:tiada tidak menempati ruang, manakala keterlihatan:tersembunyi walaupun elemen itu tidak kelihatan menempati ruang yang sama. lebar yang diperlukan dan jangan paksa pembalut garisan, seperti span, a.

boleh menukar mod paparan dua elemen secara bersama, seperti span{display:block;} atau li{display:inline;}

Nilai atribut keterlihatan boleh disembunyikan atau kelihatan atau runtuh , atribut runtuh boleh digunakan untuk menyembunyikan baris atau lajur jadual tanpa menjejaskan reka letak jadual Gantikan kedudukan elemen tersembunyi dengan yang sama ruang kosong.

Paparan CSS - Sekat dan Sebaris Elemen

ialah elemen yang mengambil keseluruhan lebar dan didahului dan diikuti dengan talian putus. Contoh elemen blok:

<h1>

<p>

<div>

elemen sebaris Sahaja lebar yang diperlukan diperlukan, tiada garis putus yang dipaksakan.

Contoh elemen sebaris:

<span>

<a>

Cara menukar paparan elemen

Ya Menukar elemen sebaris dan blok, atau sebaliknya, boleh menjadikan halaman kelihatan disatukan dalam cara tertentu dan masih mematuhi piawaian web.

Contoh berikut menggunakan elemen span sebagai elemen blok: 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
span
{
display:block;
}
</style>
</head>
<body>
<h2>标题</h2>
<span>这是一段内容</span>
<span>这也是一段内容</span>
<h2>标题</h2>
<span>内容</span>
<span>也是内容</span>
</body>
</html>

Nota: Tukar jenis paparan elemen untuk melihat cara elemen dipaparkan dan jenis elemennya. Contohnya: elemen sebaris yang ditetapkan kepada paparan:blok tidak dibenarkan mempunyai elemen blok bersarang di dalamnya.

Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> span { display:block; } </style> </head> <body> <h2>标题</h2> <span>这是一段内容</span> <span>这也是一段内容</span> <h2>标题</h2> <span>内容</span> <span>也是内容</span> </body> </html>
serahkanTetapkan Semula Kod
Bahagian sebelumnya bahagian seterusnya
Senarai Tutorial
dapatkan bantuan
  • Cadangan kursus
  • Muat turun perisian kursus
Perisian kursus tidak tersedia untuk dimuat turun pada masa ini. Kakitangan sedang menganjurkannya. Sila beri perhatian lebih kepada kursus ini pada masa hadapan~

Pelajar yang telah menonton kursus ini juga sedang belajar

Tutorial video perdana dunia ThinkPHP 5.1 terkini (60 hari untuk menjadi kursus latihan dalam talian pakar PHP)  492839 permainan