Tutorial Menghubungkan HTML Dengan CSS ini merupakan tutorial yang bisa dibilang penting. Karena jika kita tidak dapat menghubungkan HTML dengan CSS secara otomatis kita tidak mengetahui bagaimana cara untuk mendesain halaman website yang kita buat karena file HTML tidak terhubung dengan CSS. Bukan hanya CSS, tetapi PHP juga
2.CARA MENGHUBUNGKAN HTML DENGAN CSS
Untuk Cara Menghubungkan HTML Dengan CSS saya kira sangat mudah. Gunakan tag <link> untuk menghubungkan HTML dengan CSS. Tag link di letakkan pada bagian element head pada struktur HTML. Silahkan perhatikan contoh berikut :
Dari contoh diatas saya membuat tag link yang berfungsi untuk menghubungkan file html/php dengan file CSS yang kita inginkan.<!DOCTYPE html>
<html>
<head>
<title>HTML : Menghubungkan HTML dgn CSS </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<link rel="stylesheet" type="text/css" href="style.css">Atribut rel="stylesheet" dan type="text/css" merupakan deklarasi untuk menjelaskan bahwa file yang kita panggil atau hubungkan adalah file stylesheet atau CSS. Dan pada atribut href yang digunakan untuk meletakkan nama dan lokasi file CSS yang ingin kita hubungkan. Pada contoh ini saya menghubungkan file HTML saya dengan file CSS yang sudah tersedia dan bernama style.css
Jika kita run di web browser maka tidak muncul apa - apa karena HTML hanya berisi struktur dasar dan belum terisi element apapun. Untuk mencoba apakah file CSS sudah terhubung dengan file HTML kita maka akan kita cek dengan cara berikut ini. Kita buat contoh sederhana dengan cara membuat element heading, dan kemudian kita beri warna text heading 1 dengan warna biru.
Buat satu file dengan nama INDEX.html :
<!DOCTYPE html>Lalu buat file CSS nya dengan nama style.css
<html>
<head>
<title>HTML : Menghubugkan HTML dengan CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Belajar Menghubungkan HTML dengan CSS
http://muhfajarshodiq.blogspot.co.id</h1>
</body>
h1{
color: blue;
font-family: roboto;
text-align: center;
}
Hasil script saat di run
|
HTML berhasil dihubungkan dengan CSS
terbukti dengan berhasilnya syntax CSS yang kita buat mengatur
element heading 1. Syntaxt color diatas merupakan perintah untuk
menetapkan warna font/text, font-family untuk mengatur text apa yang
kita gunakan, dan text-align berfungsi untuk mengatur rata text dan
pada tutor ini kita gunakan text rata tengah. Syntax CSS diatas
merupakan syntax CSS paling dasar.
Oke sekian dulu postingan kali ini , ikuti terus postingan saya selanjutnya , sekian dan terima kasih
REFERENSI : www.malasngoding.com
Oke sekian dulu postingan kali ini , ikuti terus postingan saya selanjutnya , sekian dan terima kasih
REFERENSI : www.malasngoding.com
0 komentar:
Posting Komentar