Cara untuk menetapkan bayang garis mendatar dalam CSS: 1. Tambahkan gaya "lebar: nilai panjang garisan mendatar; ketinggian: nilai ketebalan garisan mendatar; latar belakang: warna garisan mendatar" pada elemen untuk melukis garisan mendatar ; 2. Tambah bayang garisan mendatar Tambah "bayang-kotak: kedudukan bayang-bayang mendatar dan kedudukan bayang-bayang menegak;" kepada elemen garisan untuk menetapkan bayang-bayang elemen garisan mendatar.
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.
Cara menetapkan bayang garis mendatar dalam css
Dalam artikel sebelumnya "Cara melukis garisan mendatar dan menegak menggunakan css "Dalam "Kami bercakap tentang cara melukis garisan mendatar melalui CSS, mari kita lihat cara menambah bayang-bayang pada garisan mendatar.
Dalam CSS, anda boleh menggunakan atribut box-shadow untuk menetapkan bayang-bayang garis mendatar Atribut box-shadow menambah satu atau lebih bayang-bayang pada kotak.
Sintaksnya ialah:
box-shadow: h-shadow v-shadow blur spread color inset;
Antaranya:
Contohnya seperti berikut:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.div1{
width:200px;
height:3px;
background-color:#000;
box-shadow: 10px 5px 5px #888888;
}
</style>
</head>
<body>
<div class="div1"></div>
</body>
</html>Hasil keluaran:
(Belajar perkongsian video: tutorial video css)
Atas ialah kandungan terperinci Bagaimana untuk menetapkan bayang garis mendatar dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
