Chạy thử Ví dụ Thuộc tính opacity trong CSS

Trình soạn thảo - Chạy thử Ví dụ Thuộc tính opacity trong CSS

Kết quả - Chạy thử Ví dụ Thuộc tính opacity trong CSS

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Ví dụ Thuộc tính opacity trong CSS</title>

<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
div{width:100%; float:left; height:auto; padding:15px; background:green; color:red; margin-bottom:10px}
img{width:150px; height:auto;}
</style>
</head>
<body>

<h1>Chạy thử Ví dụ Thuộc tính opacity trong CSS</h1>

<p>Dùng để làm mờ hoặc ẩn chữ, hình ảnh, background,... từ các thẻ HTML:</p>

<div style="opacity:1;" >opacity:1;</div>

<!--Làm mờ nền và làm mờ chữ-->
<div style="opacity:0.7;" >opacity:0.7;</div>

<!--Làm mờ nền không mờ chữ-->
<div style="background: rgba(0, 128, 0, 0.7);" >background: rgba(0, 128, 0, 0.7);</div>

<h4>Hình gốc</h4>
<img src="https://webmoi.vn//media/images/background-image-full-man-hinh.jpg">

<h4>Hình opacity:0.7;</h4>
<img style="opacity:0.7;" src="https://webmoi.vn//media/images/background-image-full-man-hinh.jpg">

</body>
</html>
  • Chạy thử Ví dụ Thuộc tính opacity trong CSS nằm trong bài viết Thuộc tính opacity trong CSS
  • ★★★★★ ★★★★★