cari

Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Apakah unit em dalam css3

Apakah unit em dalam css3

青灯夜游
青灯夜游asal
2021-12-15 15:28:143109semak imbas

Dalam CSS3, em ialah unit panjang relatif, berbanding saiz fon teks dalam objek semasa, iaitu saiz yang ditetapkan mengikut saiz fon jika saiz fon semasa teks sebaris tidak ada; telah ditetapkan secara manual, kemudian Relatif kepada saiz fon lalai penyemak imbas.

Apakah unit em dalam css3

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

Unit CSS em

em ialah unit panjang relatif, berbanding saiz fon teks dalam objek semasa, iaitu saiz yang ditetapkan mengikut saiz fon . Panjang unitnya ditentukan berdasarkan panjang menegak teks elemen.

Jika saiz fon semasa teks sebaris belum ditetapkan secara manual, cari saiz fon induk Jika tiada induk atau induk tidak menetapkan saiz fon, ia adalah relatif kepada saiz fon lalai penyemak imbas (16px).

Contoh 1: Secara lalai, lebar dan tinggi p dalaman diberikan terus kepada 10em

Kod sumber Examp-01

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Example 01</title>
    <style>
        #app{
            width: 10em;
            height: 10em;
            background-color: bisque;
        }
    </style>
</head>
<body>
    <div id="app"></div>
</body>
</html>

Periksa tangkapan skrin adalah seperti berikut :

Apakah unit em dalam css3

Seperti yang anda lihat, lebar dan tinggi yang kami berikan #app p ialah 10em. Selepas penyemak imbas dipaparkan, lebar dan tingginya ialah 160px. Saiz ini betul-betul 10 kali lebih besar daripada 16px.
Saiz ini betul-betul saiz fon lalai penyemak imbas sebanyak 16px.

Contoh-02 Kod sumber: 

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Example 01</title>
    <style>
        #app{
            font-size: 12px;
            width: 10em;
            height: 10em;
            background-color: bisque;
        }
    </style>
</head>
<body>
    <div id="app"></div>
</body>
</html>

Periksa tangkapan skrin:

Apakah unit em dalam css3

Dua contoh ini sudah memadai .

(Mempelajari perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Apakah unit em dalam css3. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Apakah atribut jadual css3Artikel seterusnya：Apakah atribut jadual css3

Artikel berkaitan

Lihat lagi