Rumah  >  Artikel  >  hujung hadapan web  >  Tetapkan sifat css

Tetapkan sifat css

王林
王林asal
2023-05-27 13:33:081182semak imbas

CSS (Cascading Style Sheets) ialah bahasa yang digunakan untuk mengawal gaya halaman web Melaluinya, anda boleh menetapkan fon, warna, sempadan, reka letak dan sifat lain halaman web. Apabila membangunkan halaman web, menetapkan sifat CSS adalah langkah penting. Artikel ini akan memperkenalkan secara terperinci cara menetapkan sifat CSS, serta nilai dan kaedah sifat yang biasa digunakan.

1. Cara menetapkan sifat CSS

  1. Gaya sebaris: Tambahkan atribut gaya pada teg HTML untuk menetapkan sifat CSS. Contohnya:
<p style="color: red; font-size: 16px;">Hello, world!</p>
  1. Helaian gaya dalaman: tambahkan teg gaya dalam kepala HTML dan tetapkan sifat CSS di dalamnya. Contohnya:
<head>
  <style>
    p {
      color: red;
      font-size: 16px;
    }
  </style>
</head>
<body>
  <p>Hello, world!</p>
</body>
  1. Helaian gaya luaran: Letakkan kod CSS dalam fail helaian gaya yang berasingan, kemudian rujuknya dalam HTML melalui teg pautan. Contohnya:
<head>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <p>Hello, world!</p>
</body>

2. Atribut CSS yang biasa digunakan dan nilai atributnya

  1. Atribut fon (font)
  • font- family: Tetapkan nama fon, yang boleh menjadi nama fon tertentu (seperti "Helvetica") atau fon umum (seperti "serif", "sans-serif", "monospace", dsb. .).
  • saiz fon: Tetapkan saiz fon dalam unit seperti piksel (px), peratusan (%), em (berbilang saiz fon semasa sebagai asas), dsb.
  • gaya fon: Tetapkan gaya fon, yang boleh menjadi "biasa", "italik" atau "serong".
  • berat fon: Tetapkan berat fon, yang boleh menjadi nombor (seperti 400) atau kata kunci (seperti "biasa", "tebal").
  1. Atribut warna (warna)
  • warna: Tetapkan warna teks, anda boleh menggunakan nama warna (seperti "merah" , "hijau", "biru", dsb.) atau nilai RGB, nilai RGBA (seperti "rgb(255, 0, 0)", "rgba(255, 0, 0, 0.5)"), dsb.
  1. Atribut latar belakang (latar belakang)
  • warna latar belakang: Tetapkan warna latar belakang elemen, anda boleh menggunakan nama warna atau nilai RGB , nilai RGBA, dsb. Cara.
  • imej latar belakang: Tetapkan imej latar belakang elemen, anda boleh menggunakan imej setempat atau alamat imej jauh.
  • background-repeat: Tetapkan mod ulangan imej latar belakang, yang boleh menjadi "ulang" (ulang), "repeat-x" (ulang mendatar), "repeat-y" (ulang menegak) atau " tidak berulang "(tidak berulang).
  • kedudukan latar belakang: Tetapkan kedudukan imej latar belakang, anda boleh menggunakan kata kunci (seperti "kiri atas", "tengah", "kanan bawah") atau nilai piksel, nilai peratusan, dsb.
  1. Atribut sempadan (sempadan)
  • lebar sempadan: Tetapkan lebar sempadan, anda boleh menggunakan unit seperti piksel dan em.
  • gaya sempadan: Tetapkan gaya sempadan, yang boleh menjadi "pepejal" (garisan padat), "garis putus-putus" (garis putus-putus), "garis putus-putus" (garis putus-putus), dsb.
  • warna sempadan: Tetapkan warna sempadan, anda boleh menggunakan nama warna atau nilai RGB, nilai RGBA, dsb.
  1. Atribut saiz (lebar, tinggi)
  • lebar: Tetapkan lebar elemen, anda boleh menggunakan unit seperti piksel dan peratusan.
  • tinggi: Tetapkan ketinggian elemen dalam unit seperti piksel dan peratusan.
  1. Atribut teks (teks)
  • text-align: Tetapkan penjajaran mendatar teks, yang boleh menjadi "kiri" (penjajaran kiri ), "kanan" (dijajarkan ke kanan), "tengah" (dijajarkan ke tengah), dsb.
  • hiasan teks: Tetapkan kesan hiasan teks, yang boleh menjadi "tiada" (tiada hiasan), "garis bawah" (garis bawah), "garis-garis" (garis-garis), dsb.
  • transformasi teks: Tetapkan kaedah penukaran huruf besar bagi teks, yang boleh menjadi "huruf besar" (huruf besar), "huruf kecil" (huruf kecil), "huruf besar" (huruf pertama dengan huruf besar), dsb.
  1. Atribut kotak (kotak)
  • margin: Tetapkan jidar unsur (jarak antara elemen dan unsur lain), yang boleh berada dalam piksel , peratusan dan unit lain.
  • lapik: Tetapkan jidar dalaman elemen (jarak antara kandungan elemen dan sempadan), yang boleh dalam piksel, peratusan dan unit lain.
  • paparan: Tetapkan mod paparan elemen, yang boleh menjadi "blok" (elemen peringkat blok), "sebaris" (elemen sebaris) atau "blok sebaris" (unsur tahap blok sebaris), dll.

3. Ringkasan

Menetapkan sifat CSS ialah langkah penting dalam pembangunan web Mahir dalam penggunaan sifat CSS, kami boleh mereka bentuk sifat CSS yang cantik dan mudah digunakan . Halaman web yang mudah dibaca dan digunakan. Artikel ini memperkenalkan sifat CSS yang biasa digunakan dan nilai sifatnya serta menerangkan secara terperinci tiga kaedah menetapkan sifat CSS. Saya harap pembaca boleh menggunakan CSS secara fleksibel dalam pembangunan web untuk mencipta kerja web yang lebih cemerlang.

Atas ialah kandungan terperinci Tetapkan sifat css. 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:gaya css alih keluar gayaArtikel seterusnya:gaya css alih keluar gaya