背景にCSSでグラデーション - Sample3(透明度)

このサンプルは<body>ではなく、<header>の background に、CSSで線形グラデーションを指定。
さらに色には「透明度」の指定もしています。

[↓ このページのHTML ↓]
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>タイトル</title>
<link rel="stylesheet" href="css/style3.css">
</head>

<body>
<header>
<h1>タイトル</h1>
</header>
<div id="container">
<p>テキスト</p>
<pre>ソース</pre>
<pre>ソース</pre>
</div>
<footer>
Copyright © <a href="">ほんっとにはじめてのHTML5とCSS3</a> All Rights Reserved.
</footer>
</body>
</html>
[↓ このページのCSSの抜粋 ↓]
header {
	display:block;
	padding:30px;
	color:white;
	header {
	display:block;
	padding:30px;
	color:white;
	/*headerの背景の指定*/
	background:#290cac; /*グラデーション未対応のブラウザ用*/
	background:-webkit-linear-gradient(left, rgba(0,153,255,0.5), rgba(41,12,172,0.7)); /*オールド用*/
	background:linear-gradient(to right, rgba(0,153,255,0.5), rgba(41,12,172,0.7)); /*標準型*/
	}

★このページのCSSを全部見る