Mengenal Contoh Pemanfaatan dari CSS
alhamdulillah,,,
pada postingan kali ini, saya  dapat menampilkan dan berbagi tentang salah satu tugas kulaih saya tentang CSS.

 Masih pemula dan kekurangan ide, jadi hasilnya tidak sebagus milik teman2 saya sih. . . . . . .
heheheh,,,,it's ok,,,no problem

pertama kita bikin dulu seperti di bawah ini pada notepad atau yang aplikasi lain yang dapat membatu dalam penulisan html seperti gambar di bawah ini

kemudian kita ketik pada notepad tersebut seperti di bawah ini:
===================================================================

<html>
<head>
<title>Introduction to CSS</title>
<link rel='stylesheet' href='layout.css' style='text/css'>
</head>
<body>

<p>text with no formatting</p>


<p class='khavis'><marquee direction="left">Muhammad Khavis Z adalah mahasiswa pendidikan matematika di Universitas Palangka Raya</marquee></p>
<p class='khavis1'><marquee scrollamount="12" direction="up">Bercita-cita melanjutkan studi S2, insya Allah di salah satu perguruan tinggi dalam negeri</marquee></p>
<p class='khavis2'><marquee direction="center">Sekarang telah menempuh 5 semester, insya Allah di semester 6 mengambil KKN, semester 7 PPL 2 dan semester 8 ujian skripsi serta lulus dalam jangka waktu 3,5 tahun atau 3,8 tahun</marquee></p>
<p align="center" class='khavis3'><marquee direction="down">"Harapan hidup adaah Mengubah Kesulitan Menjadi Perkembangan Diri dan Kebaikan"</marquee></p>

</body>
</html>

======================================================================
setelah seperti di atas,,,kita save di sebuah folder yang sama dengan nama tertentu,,,misal CSS.html dengan tipe All Types
lihat gambar di bawah ini:


======================================================================
setelah itu kita bikin format dari link yang sebelumnya (<link rel='stylesheet' href='layout.css' style='text/css'>) di atas seperti di bawah ini
======================================================================
.khavis{
font-family: Blackadder ITC;
font-size: 50px;
text-decoration: underline;
color: blue;
font-weight: bold;
}

.khavis1{
font-family: Times New Roman;
font-size: 50px;
text-decoration: underline;
color: blue;
font-weight: Bold;
}

.khavis2{
font-family: calibri;
font-size: 50px;
text-decoration: Underline;
color: blue;
font-weight: Bold;
}
.khavis3{
font-family: calibri;
font-size: 40px;
text-decoration: Underline;
color: blue;
font-weight: Bold;
}
========================================================================
Kemudian kita save as dengan nama yang harus sama dengan link tersebut yaitu layout
dengan types "Cascade Style Sheet File (*css)" di folder yang sama pada sebelumnya....lihat gambar di bawah ini:




hasil dari folder tersebut seperti gambar di bawah ini:


sekarang kita lihat hasilnya dengan klik 2 kali pada file "CSS" tersebut dan hasilnya adalah seperti di bawah ini: (Tulisan tersebut bergerak karena format dari marquee"

hanya ini yang dapat saya bagikan,,,semoga bermanfaat ya..............^_^

Reviews:

Posting Komentar

Berbagi Ilmu © 2014 - Designed by Templateism, Distributed By Blogger Templates | Templatelib

Contact us

Diberdayakan oleh Blogger.