Senin, 29 Desember 2014

Cara Membuat Text Shadow di CSS3

Pada tutorial kali ini, Bintaro Web akan membahas mengenai Cara Membuat Text Shadow di CSS3. Text Shadow adalah efek bayangan pada text seperti halnya kita menggunakan Adobe Photoshop.

Dahulu saat kita ingin membuat text shadow mungkin harus memasukan melalui gambar yang kita buat sebelumnya, tapi pada CSS3 kita bisa langsung membuat text shadow.

Nah, tanpa harus panjang lebar, yukk kita buat text shadow di CSS

1. Misalnya saya mempunyai kode html sebagai berikut 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Membuat Text Shadow di CSS</title>
</head>
<body>
<h1>Ini adalah text Shadow</h1>
</body>
</html>
2. Lalu, anda masukan kode CSS sebelum penutup tag head, bisa juga melalui linked css. Pada tutorial ini saya ingin merubah tag H1 dengan text shadow.
    <style>
    h1 {
    text-shadow: 2px 2px #ff0000;    }
    </style> 
3. Penjelasan skrip nya adalah : 2px yang pertama adalah untuk mengatur ketebalan shadow pada sumbu x dan 2px yang kedua adalah untuk mengatur ketebalan pada sumbu y sedangkan #ff0000 adalah kode hexa untuk menentukan warna text shadownya, bisa juga dengan nama misalnya Red.
Kode lengkapnya adalah sebagai berikut :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Membuat Text Shadow di CSS</title>
<style>
    h1 {
    text-shadow: 2px 2px #ff0000;
    }
 </style>
</head>
<body>
<h1>Ini adalah text Shadow</h1>
</body>
</html>
4. Lalu silahkan anda lihat hasilnya di browser kesayangan anda :-). Apabila anda ingin mencobanya secara online silahkan langsung klik disini

Cara Membuat Text Shadow di CSS3
Hasil Text Shadow dengan CSS3


Anda butuh Jasa Pembuatan Website untuk Perusahaan atau Toko Online anda? Segera hubungi kami sekarang juga dan dapatkan diskon akhir tahun.

Bintaro Web Design
Tlp : 02171370813
HP : 085710190845
PIN BBM : 7DC8D13D
Email : info@bintaroweb.com

Rabu, 24 Desember 2014

Cara Memasukkan Font di CSS3

Berjumpa lagi dengan Bintaro Web, kali ini kami akan membagikan tips kepada anda mengenai cara memasukkan font dalam CSS3 dengan font tertentu. Misalnya anda punya font Android dengan nama fontnya adalah android.ttf, dan ingin font tersebut ingin anda pakai dan masukan ke dalam website anda. Berikut adalah caranya
1. Misalkan kami punya code html seperti dibawah ini
!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Memasukan Font di CSS3</title>
</head>
<body>
<h1>Ini adalah heading website</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, 
sunt in culpa qui officia deserunt mollit anim id est laborum</p>
</body>
</html>
2. Letakkan font android.ttf di satu folder yang sama dengan code html anda


3. Lalu seperti biasa, anda mesti mengetikan code CSS, bisa melalui Linked CSS ataupun Embedded yaitu dengan cara langsung anda ketikan kode html nya. Pada tutorial kali ini kami menggunakan cara Embedded. Code CSS nya adalah :

@font-face {
font-family: Android;
src: url(android.ttf);
}

3. Misalnya disini saya akan gunakan tag H1 dengan font tersebut, maka ketikkan h1 { font-family: Android; } 
Code lengkapnya adalah sebagai berikut
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Contoh Memasukan Font di CSS3</title>
<style type="text/css">
@font-face {
font-family: Android;
src: url(android.ttf);
}
h1 {
font-family: Android;
}
</style>
</head>
<body>
<h1>Ini adalah heading website</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, 
sunt in culpa qui officia deserunt mollit anim id est laborum</p>
</body>
</html> 
4. Silahkan anda buka pada browser, maka sekarang tulisan "Ini adalah heading website" sudah menggunakan font Android tersebut. 


5. Selanjutnya anda bisa berkreasi menggunakan Font lain sesuai kebutuhan anda. Font ini juga bisa untuk digunakan untuk tag yang lain nya. Selamat mencoba.


Anda butuh Jasa Pembuatan Website untuk Perusahaan atau Toko Online anda? Segera hubungi kami sekarang juga dan dapatkan diskon akhir tahun.

Bintaro Web Design
Tlp : 02171370813
HP : 085710190845
PIN BBM : 7DC8D13D
Email : info@bintaroweb.com


Selasa, 23 Desember 2014

Jasa Pembuatan Website di Pondok Indah

Saat ini kebutuhan akan website untuk usaha anda sudah menjadi suatu keharusan agar profile usaha anda bisa dilihat dan dibaca oleh orang di seluruh Indonesia. Anda tidak perlu repot memperkenalkan usaha anda satu demi satu ke orang, karena semua akan dilakukan oleh website anda.

Terlebih apabila website anda mudah di cari oleh orang lain melalui search engine (mesin pencari) seperti Google, Yahoo!, Bing, dll. Oleh kerana itu, mulai dari sekarang dan segera miliki website untuk usaha anda agar lebih dikenal orang banyak.

Jasa Pembuatan Website di Pondok Indah

Kami melayani Jasa Pembuatan Website yang melayani anda di wilayah Pondok Indah dan area sekitar Jakarta Selatan. Berikut ini adalah beberapa layanan yang kami sediakan, diantaranya adalah :
1. Jasa Pembuatan Website Company Profile
Kami akan membuatkan website untuk usaha atau perusahaan anda dengan desain yang menarik, user friendly, cepat dan berkualitas.
2. Jasa Pembuatan Toko Online
Kami juga melayani pembuatan toko online untuk produk yang anda jual
3. Jasa SEO Web (Marketing Online)
Layanan ini merupakan kelanjutan dari layanan sebelumnya, yaitu apabila anda sudah memiliki website maka kami akan marketingkan website anda agar bisa dikenal oleh mesin pencari dan mendapatkan banyak pengunjung yang akhirnya bisa menjadi customer anda.

Bagi anda yang tertarik dengan Jasa Pembuatan Website kami, ayoo hubungi kami :
WA : 08119555526
Phone : 0217451687