Bagaimana untuk menetapkan gaya sempadan dalam HTML-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk menetapkan gaya sempadan dalam HTML

PHPz

Lepaskan： 2023-04-13 10:55:12

asal

7100 orang telah melayarinya

Dalam HTML, sempadan adalah bahagian penting dalam mengawal penampilan elemen halaman web. Sempadan boleh meningkatkan kebolehbacaan dan estetika halaman anda dengan menetapkan gaya, warna, lebar dan bentuk. Berikut ialah panduan terperinci tentang cara menetapkan sempadan dalam HTML.

Menetapkan sempadan menggunakan atribut gaya HTML

Sempadan boleh ditetapkan dengan menggunakan atribut gaya pada elemen HTML. Contohnya, apabila menetapkan sempadan elemen jadual, tambahkan atribut gaya berikut pada kod HTML.

<table style="border: 1px solid black;">

Salin selepas log masuk

Kod di atas menentukan sempadan hitam pejal selebar 1 piksel. Nilai lain boleh digunakan untuk menentukan gaya sempadan yang berbeza.

Gunakan helaian gaya CSS untuk menetapkan sempadan

Sempadan boleh ditetapkan di dalam atau di luar dokumen HTML menggunakan helaian gaya CSS. Tambahkan kod berikut pada kepala fail HTML untuk menggunakan helaian gaya dalaman.

<head>
  <style>
    table {
      border: 1px solid black;
    }
  </style>
</head>

Salin selepas log masuk

Kod di atas akan menambah sempadan hitam pepejal lebar 1 piksel pada semua elemen jadual.

Jika anda ingin menetapkan sempadan dalam fail CSS luaran, anda boleh menggunakan kod berikut:

table {
  border: 1px solid black;
}

Salin selepas log masuk

Kemudian pautkan fail ke dalam dokumen HTML.

<head>
  <link rel="stylesheet" type="text/css" href="styles.css">
</head>

Salin selepas log masuk

Tetapkan warna jidar

Warna jidar boleh ditukar dengan menetapkan sifat warna gaya jidar. Sebagai contoh, apabila menukar warna sempadan elemen jadual kepada merah, anda boleh menggunakan kod berikut:

table {
  border: 1px solid red;
}

Salin selepas log masuk

Begitu juga, nilai lain boleh digunakan untuk menentukan warna yang berbeza.

Tetapkan lebar sempadan

Lebar sempadan boleh ditukar dengan menetapkan sifat lebar gaya sempadan. Contohnya, apabila menukar lebar sempadan elemen jadual kepada 2 piksel, anda boleh menggunakan kod berikut:

table {
  border: 2px solid black;
}

Salin selepas log masuk

Nilai lain boleh digunakan untuk menentukan lebar yang berbeza.

Tetapkan bentuk sempadan

Bentuk sempadan boleh ditukar dengan menetapkan sifat bentuk gaya sempadan. Contohnya, apabila membuat jidar elemen jadual dibundarkan, anda boleh menggunakan kod berikut:

table {
  border: 1px solid black;
  border-radius: 10px;
}

Salin selepas log masuk

Kod di atas menetapkan jejari sempadan jadual kepada 10 piksel.

Ringkasan

Menetapkan sempadan dalam HTML boleh meningkatkan kebolehbacaan dan estetika halaman. Sempadan boleh ditetapkan melalui sifat gaya terbina dalam atau menggunakan helaian gaya CSS, dan warna, lebar dan bentuk jidar juga boleh ditukar. Menggunakan kaedah mudah ini, anda boleh menambah gaya yang cantik pada halaman web anda dengan mudah.

Atas ialah kandungan terperinci Bagaimana untuk menetapkan gaya sempadan dalam HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!