2 つの背景を重ねる Css メソッド: まず HTML サンプル ファイルを作成し、次に [background-image:url(画像アドレス),url(画像アドレス);] を使用して 2 つの背景画像を重ねます。
このチュートリアルの動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。
推奨: css ビデオ チュートリアル
css では、background-image:url (画像アドレス), url (画像アドレス); を使用して 2 つの背景を作成できます。画像が重なって表示されます。
このように、2 つの形状をブレンドして美しいものを作るというアイデアがあると、素晴らしい結果が得られます。
例:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
body {
background-image: url(https://image.flaticon.com/icons/svg/748/748122.svg), url(https://images.unsplash.com/photo-1478719059408-592965723cbc?ixlib=rb-1.2.1&auto=format&fit=crop&w=2212&q=80);
background-position: center, top;
background-repeat: repeat, no-repeat;
background-size: contain, cover;
}
</style>
</head>
<body>
<!-- Your content here -->
</body>
</html>レンダリング:
以上がCSSで2つの背景を重ねる方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
