Bagaimanakah Saya Boleh Menambah Sempadan pada Div Tanpa Meningkatkan Saiznya?

Nestling Border Within a Div

Untuk memasukkan sempadan dalam elemen div tanpa memanjangkan dimensinya, gunakan sifat bersaiz kotak. Secara lalai, penyemak imbas menganggap jidar dan pelapik sebagai sebahagian daripada kandungan elemen, mengembangkan saiz elemen untuk menampungnya. Walau bagaimanapun, menetapkan saiz kotak kepada kotak sempadan memberitahu penyemak imbas untuk memasukkan jidar dalam saiz keseluruhan elemen, memastikan ia kekal konsisten tanpa mengira lebar jidar.

Dalam contoh anda, anda boleh menggunakan gaya berikut:

div {
    box-sizing: border-box;
    width: 100px;
    height: 100px;
    border: 1px solid black;
}

Dengan penggayaan ini, jidar akan diletakkan 1 piksel dalam tepi div, tanpa mengubah dimensi keseluruhannya. Ini menyelesaikan isu perlu melakukan pengiraan tambahan untuk melaraskan lebar sempadan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Sempadan pada Div Tanpa Meningkatkan Saiznya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!