section heading hidden

Topik Bahasan : Belajar CSS

Cara Membuat Website Dengan HTML Dan CSS Dasar

Cara Membuat Website Dengan HTML Dan CSS Dasar

Untuk mengatur layout halaman website, digunakanlah script css. CSS adalah singkatan dari Cascading Style Sheets. Dengan menggunakan css, halaman website menjadi lebih menarik dan memiliki tampilan yang bagus. Di artikel ini saya akan membahas tentang cara membuat website dengan html dan css dasar.

Sebelumnya saya telah membahas tentang cara membuat website dengan html. Di dalam website html tersebut, akan ditambahkan script css untuk mengatur layout website sehingga tampilan website menjadi lebih menarik. Untuk menambahkan script css ke dalam script html, ikuti langkah-langkah berikut di bawah ini.

  1. Buat script html seperti di bawah ini menggunakan aplikasi text editor. Anda bisa menggunakan aplikasi text editor gratis seperti Visual Studio Code yang bisa diunduh secara gratis di website https://code.visualstudio.com.
<!DOCTYPE html>
<html lang="id">
<head>
<title>Halaman Website Script HTML</title>
</head>
<body>

<p>Selamat datang di Halaman Website Script HTML.</p>


</body>
</html> 
  1. Simpan file tersebut dengan nama index.html di komputer.
  2. Sekarang klik file index.html tersebut. Berikut ini tampilan website html yang barusan dibuat.


Cara Membuat Website Dengan HTML Dan CSS Dasar

  1. Script css untuk memberi warna merah untuk paragraf (p).
<style type="text/css">
p{
  color: red;
}
</style>
  1. Jika digabungkan dengan script html, menjadi seperti berikut ini.
<!DOCTYPE html>
<html lang="id">
<head>
<title>Halaman Website Script HTML</title>
</head>
<style type="text/css">
p{
  color: red;
}
</style>
<body>

<p>Selamat datang di Halaman Website Script HTML.</p>


</body>
</html> 
  1. Berikut ini tampilan website anda sekarang.


Cara Membuat Website Dengan HTML Dan CSS Dasar

  1. Untuk memberi warna background green(hijau), anda tambahkan script css berikut di script html.
<style type="text/css">
p{
  color: red;
}
body{
	background: green;
}
</style>
  1. Setelah ditambahkan script css untuk warna background, berikut ini tampilan website html yang barusan dibuat.


Cara Membuat Website Dengan HTML Dan CSS Dasar

  1. Script html dengan script cssnya.
<!DOCTYPE html>
<html lang="id">
<head>
<title>Halaman Website Script HTML</title>
</head>
<style type="text/css">
p{
  color: red;
}
body{
	background: green;
}
</style>
<body>

<p>Selamat datang di Halaman Website Script HTML.</p>


</body>
</html> 

Demikian tutorial singkat cara membuat website dengan html dan css dasar. Sebenarnya masih banyak script css yang bisa anda tambahkan ke dalam script html sehingga tampilan website anda lebih cantik dan menarik.

Author: Ahmad

Saya seorang blogger yang belajar programming.

Komentar