Sekarang kita mula menerangkan pengetahuan asas css:
Sebelum bercakap tentang pengetahuan asas, kita perlu tahu cara menulis komen dalam css
/*Kandungan komen*/
Fon: fon
Apakah operasi yang kami ada pada fon:
Warna warna fon Saiz saiz fon Font gaya fon-keluarga Italic gaya fon font-berat garis bawah teks-hiasan ketinggian garis
Mari kita jelaskan melalui contoh:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
font-size: 20px; /*字体大小*/
color: red; /*字体颜色*/
font-weight: bold; /*字体粗细*/
font-style: oblique;
/*italic:斜体。对于没有斜体变量的特殊字体，将应用 oblique
normal:默认值。正常的字体
oblique倾斜的字体
*/
text-decoration:none; /*none : 默认值。无装饰
blink : 闪烁
underline : 下划线
line-through : 贯穿线
overline : 上划线
*/
font-family:隶书; /*什么样的字体。宋体，隶书等*/
}
</style>
</head>
<body>
中华名族伟大复兴
</body>
</html>Teks teks
Penjajaran teks penjajaran teks
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
text-align:center;
}
</style>
</head>
<body>
中华名族伟大复兴
</body>
</html>Latar belakang
Latar belakang warna latar belakang-warna imej latar belakang imej latar belakang
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
background-color:red;
background-image:url("1.jpg");
}
</style>
</head>
<body>
中华名族伟大复兴
</body>
</html>Saiz
lebar lebar Tinggi ketinggian
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
div{
background-color: red;
width: 100px;
height:100px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>margin dan padding
atribut trengkas margin menetapkan semua margin dalam satu sifat pernyataan. Atribut ini boleh mempunyai 1 hingga 4 nilai. <<>
Margin: 10px 5px 15px 20px
Jarak atas ialah 10px
>
Jidar bawah ialah; 15px
Jidar kiri ialah 20px
sifat trengkas padding menetapkan semua sifat padding dalam satu pernyataan. Atribut ini boleh mempunyai 1 hingga 4 nilai.
padding: 10px 5px 15px 20px; 🎜>
sempadan sempadan
Tetapkan ketebalan dan warna jidar
sempadan:1px merah pepejal; 1 piksel, dan garisan berwarna merah
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
div{
margin-left:50px;
margin-top:50px;
background-color:#ccc;
width:150px;
height:150px;
border:1px solid red;
}
</style>
</head>
<body>
<div>测试</div>
</body>
</html>Selepas berjalan seperti ini, perkataan berada dalam Bagaimana untuk mengalihkan teks di sudut kiri atas div ke tengah Ia sebenarnya sangat mudah
Hanya tambahkan dua gaya pada css div
text-align: center;
line-height: 150px;bahagian seterusnya
