ให้เรตสมาชิก: 4 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งาน
 

Opacity (โอพาซิตี้)  คืออะไร? 

ค่า Opacity คือค่าความทึบแสง หรือความโปร่งแสงของภาพ 

ยิ่งเราปรับค่า Opacity ให้ต่ำลงเท่าใด ภาพก็จะยิ่งทึบมากขึ้นเท่านั้น 

เช่น เราปรับค่า Opacity ให้เป็น 0.2 ภาพที่แสดงออกมา ก็จะทึบแสงมากกว่าการปรับค่า Opacity ให้เป็น 0.5

ตัวอย่าง 

ภาพการปรับค่า Opacity ให้เป็น 0.5
ภาพการปรับค่า Opacity ให้เป็น 0.2
จะเห็นได้ว่า การที่เราปรับค่า Opacity ให้ต่ำลงมากเท่าใด ภาพก็จะจางลงมากเท่านั้น 
ตัวอย่าง Code (โค้ด) การปรับค่า opacity
<head>
<style>
img {
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}

img:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
</style>
</head>
<body>

<h1>Image Transparency</h1>
<p>The opacity property is often used together with the :hover selector to change the opacity on mouse-over:</p>
<img src="/test/test1.jpg" alt="Forest" width="170" height="100">


<p><b>Note:</b> In IE, a !DOCTYPE must be added for the :hover selector to work on other elements than the a element.</p>

</body>
</html>

 

Reference : W3School. "CSS" [ออนไลน์]. เข้าุถึงได้จาก https://www.w3schools.com/css/ [2 พฤศจิกายน 2560]

อ้างอิงภาพ : www.google.com

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
ติดตั้งJoomla ไม่ได้ค่ะ
โดย Anonymous อ 23 ก.ย. 2018 5:21 pm บอร์ด Joomla Development
1
7
อ 23 ก.ย. 2018 5:30 pm โดย mindphp
Q - ถามเรื่องการ UPDATE INSERT ข้อมูล sql server ครับ ว่าแบบ Function กับ แบบทั่วไป แบบไหนปลอดภัยกว่า
โดย nuattawoot อ 23 ก.ย. 2018 3:48 pm บอร์ด SQL - Database
0
13
อ 23 ก.ย. 2018 3:48 pm โดย nuattawoot
อยากได้คนช่วยทำ app mobile ด่วน
โดย Pongpat Rakdej อ 23 ก.ย. 2018 10:05 am บอร์ด Mobile Programming - Android, iOS, Window Phone
1
12
อ 23 ก.ย. 2018 4:29 pm โดย mindphp
การเชื่อม Pgadmin III กับ SSL Certificate ให้กับ Website ผ่าน DirectAdmin อย่างไร
โดย kkeinezung ส 22 ก.ย. 2018 6:54 pm บอร์ด SQL - Database
3
28
อ 23 ก.ย. 2018 5:32 pm โดย mindphp
R - phpBB
โดย Ittichai_chupol ส 22 ก.ย. 2018 6:51 pm บอร์ด M070 - อิทธิชัย ชูผล
0
4
ส 22 ก.ย. 2018 6:51 pm โดย Ittichai_chupol
เขาวัง สิ่งคู่บ้านเพชรบุรี
โดย Ittichai_chupol ส 22 ก.ย. 2018 3:52 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
13
ส 22 ก.ย. 2018 3:52 pm โดย Ittichai_chupol
งานประจำวันที่ 22 กันยายน 2561
โดย muneela ส 22 ก.ย. 2018 10:38 am บอร์ด M068 - มุนีลา หมัดบาซา
2
9
จ 24 ก.ย. 2018 9:30 am โดย thatsawan
งานประจำวันที่ 22 กันยายน 2561
โดย tatiya ส 22 ก.ย. 2018 10:02 am บอร์ด M065 - ตติยะ นาชัย
1
4
ส 22 ก.ย. 2018 7:45 pm โดย tatiya
งานประจำวันที่ 22 มิถุนายน 2561
โดย Ittichai_chupol ส 22 ก.ย. 2018 9:50 am บอร์ด M070 - อิทธิชัย ชูผล
1
9
ส 22 ก.ย. 2018 7:16 pm โดย Ittichai_chupol
R-mdsoft_purchases_order_print
โดย tatiya ศ 21 ก.ย. 2018 7:02 pm บอร์ด M065 - ตติยะ นาชัย
1
9
ส 22 ก.ย. 2018 7:05 pm โดย tatiya
Logo ThailandHotel
โดย tai14 ศ 21 ก.ย. 2018 3:53 pm บอร์ด MT26 - นางสาวอัครยุภา ยงยุทธ
0
6
ศ 21 ก.ย. 2018 3:53 pm โดย tai14
Thaivi Web Upgrade List
โดย mindphp ศ 21 ก.ย. 2018 1:55 pm บอร์ด phpBB3 Project
2
5
ส 22 ก.ย. 2018 5:10 pm โดย thatsawan
R - mdsoft_ziri_invoice_print - ใบอินวอยซ์ (MT24)
โดย prakon ศ 21 ก.ย. 2018 10:15 am บอร์ด MT24 - นายปกรณ์ วิริยะธนวิโรจน์
1
11
ศ 21 ก.ย. 2018 7:05 pm โดย prakon
งานประจำวันที่ 21 กันยายน 2561
โดย prakon ศ 21 ก.ย. 2018 9:44 am บอร์ด MT24 - นายปกรณ์ วิริยะธนวิโรจน์
1
17
ศ 21 ก.ย. 2018 9:46 am โดย prakon
งานประจำวันที่ 21 กันยายน 2561
โดย Ittichai_chupol ศ 21 ก.ย. 2018 9:44 am บอร์ด M070 - อิทธิชัย ชูผล
1
13
ศ 21 ก.ย. 2018 6:29 pm โดย Ittichai_chupol
งานประจำวันที่ 21 กันยายน 2561
โดย muneela ศ 21 ก.ย. 2018 9:37 am บอร์ด M068 - มุนีลา หมัดบาซา
1
14
ศ 21 ก.ย. 2018 6:26 pm โดย muneela
งานประจำวันที่ 21 กันยายน 2561
โดย tatiya ศ 21 ก.ย. 2018 9:35 am บอร์ด M065 - ตติยะ นาชัย
1
8
ส 22 ก.ย. 2018 7:17 pm โดย tatiya
งานประจำวันที่ 21 กันยายน 2561
โดย pprn ศ 21 ก.ย. 2018 9:17 am บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
1
8
ศ 21 ก.ย. 2018 6:12 pm โดย pprn
งานประจำวันที่ 21 กันยายน 2561
โดย tai14 ศ 21 ก.ย. 2018 9:11 am บอร์ด MT26 - นางสาวอัครยุภา ยงยุทธ
1
6
ศ 21 ก.ย. 2018 6:18 pm โดย tai14
R - mod_jshopping_products_reviews โมดูลการรีวิวสินค้า
โดย pprn พฤ 20 ก.ย. 2018 6:58 pm บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
2
9
ศ 21 ก.ย. 2018 6:12 pm โดย pprn