108 lines
2.7 KiB
HTML
108 lines
2.7 KiB
HTML
<!DOCTYPE html
|
|
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
|
<head>
|
|
<style>
|
|
div {
|
|
border: 2px solid #000;
|
|
width: 50px;
|
|
height: 50px;
|
|
margin: 10px;
|
|
background: green;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<h1>Nested block elements</h1>
|
|
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
<div style="opacity: 0.8;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
|
|
<h1>Inline elements</h1>
|
|
|
|
<span style="width: 100%;">
|
|
<span style="opacity: 0.1">ab</span>
|
|
<span style="opacity: 0.2">cb</span>
|
|
<span style="opacity: 0.3">ef</span>
|
|
<span style="opacity: 0.4">gh</span>
|
|
<span style="opacity: 0.5">ij</span>
|
|
<span style="opacity: 0.6">kl</span>
|
|
<span style="opacity: 0.7">mn</span>
|
|
<span style="opacity: 0.8">op</span>
|
|
<span style="opacity: 0.9">qr</span>
|
|
<span style="opacity: 1.0">st</span>
|
|
</span>
|
|
|
|
<br/>
|
|
|
|
<span style="width: 100%; opacity: 0.5;">
|
|
<span style="opacity: 0.1">ab</span>
|
|
<span style="opacity: 0.2">cb</span>
|
|
<span style="opacity: 0.3">ef</span>
|
|
<span style="opacity: 0.4">gh</span>
|
|
<span style="opacity: 0.5">ij</span>
|
|
<span style="opacity: 0.6">kl</span>
|
|
<span style="opacity: 0.7">mn</span>
|
|
<span style="opacity: 0.8">op</span>
|
|
<span style="opacity: 0.9">qr</span>
|
|
<span style="opacity: 1.0">st</span>
|
|
</span>
|
|
|
|
<div style="opacity: 0.1;">0.1</div>
|
|
<div style="opacity: 0.2;">0.2</div>
|
|
<div style="opacity: 0.3;">0.3</div>
|
|
<div style="opacity: 0.4;">0.4</div>
|
|
<div style="opacity: 0.5;">0.5</div>
|
|
<div style="opacity: 0.6;">0.6</div>
|
|
<div style="opacity: 0.7;">0.7</div>
|
|
<div style="opacity: 0.8;">0.8</div>
|
|
<div style="opacity: 0.9;">0.9</div>
|
|
<div style="opacity: 1.0;">1.0</div>
|
|
|
|
<div style="opacity: 1.0;">1.0 opacity</div>
|
|
<div>No opacity</div>
|
|
|
|
<div style="opacity: 0.5; height: auto;">
|
|
<div style="opacity: 0.5;">
|
|
<div style="opacity: 1.0;"></div>
|
|
<div style="opacity: 0.5;"></div>
|
|
</div>
|
|
<div style="opacity: 0.5;"></div>
|
|
</div>
|
|
|
|
</body> </html>
|