Cara Mudah Membuat Background Fixed Menggunakan HTML5 Dan CSS3

Hallo teman teman balik lagi dengan saya Ismet Maulana kali ini saya ingin berbagi pengetahuan tentang Bagaimana Cara Mudah Membuat Background Fixed Menggunakan HTML5 Dan CSS3, mudah sekali untuk mendapatkan/menerapkan sebuah background fixed pada sebuah website, oke langsung saja yah teman teman, teman teman bisa langsung salinkan scriptnya dibawah sini :

<body>
	<div class="container">
		<article>
			<h1>What is Lorem Ipsum?</h1>
			<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
		</article>
		<div class="article">
			<h1>What is Lorem Ipsum?</h1>
			<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
			<h1>What is Lorem Ipsum?</h1>
			<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
		</div>
		<footer>
			<p>Dumet School &copy; 2017</p>
		</footer>
	</div>
</body>

dan ini css nya :

<style>
		
		
		.container	{width: 900px; margin: auto;}
		article {background: #DADBDD;}
		.article {background: url('bg-1.jpg') center; background-attachment: fixed; color: black; height: 1000px}
		footer {background: #27488F; padding: 10px; color: #fff}

	</style>

Jika sudah coba teman teman save dan jalankan dibrowsernya lalu coba scroll ke bawah apa yang terjadi maka background akan tetap fixed/tetap pada tempatnya, cukup mudah bukan? Oke sekian tutorial tentang Bagaimana Cara Mudah Membuat Background Fixed Menggunakan HTML5 Dan CSS3 sampai bertemu diartikel selanjutnya dan sampai jumpa.

Untuk melihat Hasilnya bisa Klik DEMO

#KeepLearn

#IsmetMA