masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu

Senarai tutorial asas CSS dan sifat sempadan

Atribut senarai CSS

Pelbagai simbol di hadapan peluru atau nombor tidak boleh diubah dalam gaya, jadi dalam praktiknya kita biasanya tidak menggunakan mereka.

  • gaya senarai: gaya senarai, nilai: tiada. Keluarkan pelbagai simbol sebelum peluru atau nombor. 

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        ul,li{list-style:none;}/*去掉前面的符号*/
    </style>
    </head>
    <body>
        <ul>
            <li>HTML+CSS</li>
            <li>JavaScript</li>
            <li>MySQL</li>
            <li>PHP</li>
        </ul>
    </body>
</html>

Atribut sempadan CSS: Setiap elemen boleh mempunyai sempadan

  • sempadan-kiri: garis sempadan kiri.

  • Format: sempadan-kiri: Gaya garisan Ketebalan Warna garisan; pepejal (garisan pepejal), putus-putus (garis putus-putus), putus-putus (garis putus-putus)

  • Contoh: sempadan-kiri: 5px merah putus-putus; >

    • sempadan-kanan: Garisan sempadan kanan.

    • bahagian atas sempadan: garisan sempadan atas.

  • bahagian bawah sempadan: garisan sempadan bawah.

  • sempadan: Tambahkan sempadan pada empat sisi pada masa yang sama. 

  • <!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        .box{
            background-color:#66ff66;
            width:200px;
            height:200px;
            border-left:6px solid red;
            border-right:3px dashed blue;
            border-top:5px dotted black;
        }
    </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>

Meneruskan pembelajaran
||
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> <style type="text/css"> ul,li{list-style:none;}/*去掉前面的符号*/ </style> </head> <body> <ul> <li>HTML+CSS</li> <li>JavaScript</li> <li>MySQL</li> <li>PHP</li> </ul> </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)  492411 permainan