在前面有介紹過HTML的16種基本色系與其對應的RGB,今天將更深入探討色彩屬性值~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>顏色透明度&不透明度</title>
</head>
<body>
<h3 style="color: rgba(39, 106, 39, 0.8);">原圖</h3>
<img src="art.jpg" width="200">
<h3 style="color: hsla(226, 59%, 70%, 0.7);">圖片不透明度0.3</h3>
<img src="art.jpg" width="200" style="opacity:0.3;">
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>背景圖片重複排列方式</title>
</head>
<body style="background-image: url(apple.png); background-repeat: space;">
<h2 style="text-align: center;">紅色蘋果</h2>
</body>
</html>
前面介紹了許多背景屬性,若覺得逐條設定很麻煩,可以利用下面這個方式來快速設定。