The opacity property sets the opacity level for an element, opacity allows to change the transparency of an element.
- Syntax:<style> #dv { background-color:#babafe; width:200px; height:100px; opacity:0.4; } </style> <h4>Example opacity 40%</h4> <div id='dv'>Some content ...</div>
<style> #im { opacity:0.5; } </style> <h4>Example opacity 50% on image</h4> <img src='css/html_course.jpg' alt='HTML and CSS Course' width='155' height='160' id='im' />
<style> #im2 { opacity:0.5; } #im2:hover { opacity:1; } </style> <h4>Example changing transparency on hover</h4> <p>Place the mouse over the image below.</p> <img src='css/html_course.jpg' alt='HTML and CSS Course' width='155' height='160' id='im2' />
<style> #trans { display:none; position:absolute; top:2%; left:2%; width:96%; height:95%; background-color:#07fe08; opacity:0.5; } #cnt { position:relative; background:#e7e8fe; width:300px; height:200px; border:1px solid blue; padding:20px; } #cnt:hover #trans { display:block; } </style> <h4>Example content hovered with transparency element on hover</h4> <div id='cnt'> <div id='trans'></div> Place the mouse over this box to see the opacity effect. <img src='css/css3.jpg' alt='CSS3 opacity' width='160' height='98' /> </div>
<div>Web Programming and Development</div>
h2 { text-decoration: underline; }
function someFunction() { alert("CoursesWeb.net"); } setTimeout("someFunction()", 2000);
$food =["fruits" =>["banana", "apple"), "veggie" =>["collard", "pea")); $nr_food = count($food, 1); echo $nr_food; // 6