Format teks CSSLOGIN

Format teks CSS

Warna Teks

Atribut warna digunakan untuk menetapkan warna teks.

Warna paling kerap ditentukan melalui CSS:

Nilai perenambelasan - seperti "#FF0000"

Nilai RGB - "RGB (255,0,0 )"

Nama warna - seperti "merah"

Warna latar belakang halaman web merujuk kepada pemilihan dalam badan:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
body {color:red;}
h1 {color:#00ff00;}
p.ex {color:rgb(0,0,255);}
</style>
</head>
<body>
<h1>多些书卷气 少些书生气</h1>
<p>人有书卷气,气质美如兰。有书卷气的人,身上有那么一股淡淡的书香,透着墨的芬芳,留着砚的韵味,带着纸的气息。
千百年来,那一缕缕飘逸的书香,把一批批文人志士熏陶和浸润得文雅儒雅、优雅高雅。</p>
<p class="ex">漫步历史长廊,洋溢书卷气的人不胜枚举</p>
</body>
</html>

Penjajaran teks

Harta penjajaran teks digunakan untuk menetapkan penjajaran mendatar teks.

Teks boleh dipusatkan atau dijajarkan ke kiri atau kanan, dibenarkan pada kedua-dua hujung

Apabila penjajaran teks ditetapkan kepada "justify", setiap baris dikembangkan untuk mempunyai lebar yang sama. jidar kiri dan kanan ialah Penjajaran (seperti majalah dan surat khabar).

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}
</style>
</head>
<body>
<h1>CSS text-align 实例</h1>
<p class="date">xxxx 年 x 月 xx号</p>
<p class="main">有一个年轻人去买碗,来到店里他顺手拿起一只碗,然后依次与其它碗轻轻碰击,碗与碗之间相碰时立即发出沉闷、浑浊的声响,他失望地摇摇头。
然后去试下一只碗。。。他几乎挑遍了店里所有的碗,竟然没有一只满意的,就连老板捧出的自认为是店里碗中精品也被他摇着头失望地放回去了。</p>
<p><b>注意:</b> 重置浏览器窗口大小查看 &quot;justify&quot; 是如何工作的。</p>
</body>
</html>

Hiasan Teks

Atribut hiasan teks digunakan untuk menetapkan atau memadamkan hiasan teks.

Dari perspektif reka bentuk, atribut hiasan teks digunakan terutamanya untuk mengalih keluar garis bawah pautan:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
a {text-decoration:none;}
</style>
</head>
<body>
<p>链接到: <a href="#">php.cn</a></p>
</body>
</html>

Anda juga boleh menghiasi teks seperti ini:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
</style>
</head>
<body>
<h1>好好学习</h1>
<h2>原价¥30</h2>
<h3>现价¥10</h3>

</body>
</html>

Penukaran teks

Sifat penukaran teks digunakan untuk menentukan huruf besar dan huruf kecil dalam teks.

boleh digunakan untuk menjadikan semua perkataan huruf besar atau huruf kecil, atau menggunakan huruf besar pada huruf pertama setiap perkataan.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}
</style>
</head>
<body>
<p class="uppercase">This is some text.</p>
<p class="lowercase">This is some text.</p>
<p class="capitalize">This is some text.</p>
</body>
</html>

Inden Teks

Sifat inden teks digunakan untuk menentukan inden baris pertama teks.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
p {text-indent:30px;}
</style>
</head>
<body>
<p>无疑的,这些人都在做着一个相同的动作:玩手机。
令人感到讽刺的是,尽管电视的广告里不断地重复着“不做低头族,出行更安全”的提醒,可这些聚精会神的“低头族们”压根就当没听见似的,
继续旁若无人地玩着手机不把自已的生命当回事儿。有些用微信在聊天,有些在玩手游,有些在看影视剧,有些打电话等等。</p>
</body>
</html>

Semua sifat teks CSS.


Hartanah                                                                                                                               Tetapkan warna                                                                                                                                                                 Tetapkan warna teks

jarak huruf                                                                                                                                                                                                                       Jajarkan teks dalam elemen

hiasan teks Tambahkan pada teks Ubah suai

🎜 dalam teks pada baris pertama

🎜> dalam baris pertama teks text-shadow Tetapkan bayang teks

text-transform Kawal huruf dalam elemen

unicode-bidi Tetapkan atau kembalikan sama ada teks ditulis semula

vertical-align Set the penjajaran menegak elemen

ruang putih Tetapkan kaedah pemprosesan ruang putih dalam elemen

jarak perkataan Tetapkan jarak perkataan

bahagian seterusnya
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <style> h1 {text-decoration:overline;} h2 {text-decoration:line-through;} h3 {text-decoration:underline;} </style> </head> <body> <h1>好好学习</h1> <h2>原价¥30</h2> <h3>现价¥10</h3> </body> </html>
babperisian kursus