Edit in JSFiddle

<h1>Halo dunia musik</h1>

<!-- Gunakan class untuk mengatur elemen lebih spesifik -->
<p class="warna-biru">
  Musik membawa sebuah ketengan jiwa.
</p>


<!-- Class dapat digabung dengan spasi sebagai pemisah -->
<p class="bg-kuning jarak-20px">
  Musik adalah sarana hiburan yang penting untuk manusia.
</p>

<!-- div dan span bisa digunakan sebagai penggalan dekorasi (div==block==beda baris) (span==inline==sama baris) -->

<div class="ukuran-full warna-putih jarak-20px bg-konser">
  <h1>
    Musik berawal dari sini
  </h1>
  <p>
  Daftar <span class="besar">sekarang</span> 
  </p>
</div>

<hr>

<button id="tombol-beli" class="besar">Daftar Sekarang</button>
/* Comment CSS Bentuknya beda dengan HTML */

/* body adalah elemen teratas. Mengaturnya berarti semua elemen didalam HTML akan ikut */
body {
  font-family: Arial; /* Ganti font menjadi Arial */
}

/* Aturan untuk semua elemen h1 */
h1 {
  text-align: center; /* Atur ketengah */
}


/* Aturan untuk semua elemen dengan class warna-biru */
.warna-biru {
  color: blue; /* Kasih warna teks biru */
}

.warna-putih {
  color: white;  /* Kasih warna teks putih */
}

.bg-kuning {
  background-color: yellow; /* Kasih warna nackground kuning */
}

.jarak-20px {
  padding: 20px;  /* jarak untuk didalam elemen semua sisi 20px */
}


.ukuran-full {
  width: 100%;  /* Ukuran lebar 100% (full) */
  height: 300px; /* Ukuran tinggi 300px */
  box-sizing: border-box; /* Google "CSS Border Box Sizing" */
}

button {
  width: 100%; /* Ukuran lebar 100% (full) */
  margin: 10px 0px 0px 0px; /* jarak atas untuk diluar elemen 10px*/
  /* Format koodinate margin/padding/border: 
    <semuasisi> <atasbawah kirikanan> <atas kanan bawah kiri> */
}

.besar {
  font-size: 30px; /* Ukuran huruf 40px */
  font-weight: bold; /* Huruf tebal*/
}

hr {
  /* border/garis 8px kuning */
  border: 8px solid yellow;
}
/* Aturan untuk semua elemen div dengan class bg-konser */
div.bg-konser {
  background-image: url(https://www.w3schools.com/bootstrap/ny.jpg); /* Background */
  background-size: cover; /* Ukuran background (cover/contain) */
}

#tombol-beli {
  /* Backtround Gradien */
  background: linear-gradient(white, cyan);
  /* Border warna solid (cyan) */
  border: 1px solid cyan;
  /* Agar seperti bisa diklik (cursornya) */
  cursor: pointer;
}

/* CSS khusus saat #tombol-beli di hover (mouse didekati) */
#tombol-beli:hover {
  background: blue;
  color: white;
}