значения свойства:
* {
margin
:
0
;
padding
}
.main {
width
600px
height
500px
position
absolute
left
50%
top
margin-left
-300px
margin-top
-250px
.a {
298px
98px
font-size
26px
background-color
#00F
border
1px
solid
#808080
text-align
center
line-height
float
.b {
.c {
#div
1
{
opacity:
4
0.3
5
0.0
* { margin: 0; padding: 0; } .main { width: 600px; height: 500px; position: absolute; left: 50%; top: 50%; margin-left: -300px; margin-top: -250px; } .a { width: 298px; height: 98px; font-size: 26px; background-color: #00F; border: 1px solid #808080; text-align: center; line-height: 98px; float: left; } .b { width: 298px; height: 98px; font-size: 26px; border: 1px solid #808080; text-align: center; line-height: 98px; float: left; } .c { width: 600px; } #div1 { opacity: 1; } #div4 { opacity: 0.3; } #div5 { opacity: 0.0; }
<!DOCTYPE html>
<
html
>
head
meta
charset
=
"utf-8"
/>
title
>New Page</
link
href
"css/style.css"
rel
"stylesheet"
script
type
"text/javascript"
src
"https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"
></
</
body
div
class
"main"
"c"
id
"div1"
"a"
>Hello World!</
"b"
>opacity = 1</
"div2"
>opacity = 0.7</
"div3"
>opacity = 0.5</
"div4"
>opacity = 0.3</
"div5"
>opacity = 0</
/*JavaScript*/
document.getElementById("div2").style.opacity = "0.7";
/*jQuery*/
$(document).ready(function () {
$("#div3").css({ "opacity": "0.5" });
});