Dalam CSS, anda boleh menggunakan atribut sempadan dan "atas sempadan" untuk mencapai kesan trapezoid Anda hanya perlu menambah "sempadan: nilai ketebalan pepejal telus; atas sempadan: tinggi trapezoid warna trapezium pepejal. ;" gaya kepada elemen, iaitu Boleh.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.
Bagaimana untuk melaksanakan trapezoid dalam css3
Dalam css, jika kita mahu Buat kesan corak trapezoid, bagaimana untuk mencapainya? Contoh berikut menerangkan cara untuk mencapai kesan corak trapezoid dalam CSS3.
Contoh adalah 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 type="text/css">
div{
border:25px solid transparent;
border-top: 25px solid red;
height: 200px;
width: 100px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>Hasil keluaran:
(Belajar perkongsian video: tutorial video css )
Atas ialah kandungan terperinci Bagaimana untuk merealisasikan trapezoid dalam css3. 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)
