Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 2]

Ukuran: px
Mulai penontonan dengan halaman:

Download "Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 2]"

Transkripsi

1

2 Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 2] Oleh: Sendy PK Sekarang kita akan menambahkan CSS pada halaman HTML kita untuk memperindah tampilan form. Sebagian besar CSS posisi form dan status messages di tengah jendela, dan form style dan form fields. <style type="text/css"> /* Add some margin to the page and set a default font and colour */... Sekarang kita akan menambahkan CSS pada halaman HTML kita untuk memperindah tampilan form. Sebagian besar CSS posisi form dan status messages di tengah jendela, dan form style dan form fields. <style type="text/css">

3 /* Add some margin to the page and set a default font and colour */ body { margin: 30px; font-family: "Georgia", serif; line-height: 1.8em; color: #333; /* Set the content dimensions */ #content { width: 800px; padding: 50px; margin: 0 <span class="wb6hlyvz4" id="wb6hlyvz4_6" style="height: 16px;">auto</span>; display: <span class="wb6hlyvz4" id="wb6hlyvz4_5" style="height: 16px;">block</span>; font-size: 1.2em; #content h2 { line-height: 1.5em; /* Add curved borders to various elements */ #contactform,.statusmessage, input[type="submit"], input[type="button"] { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; /* Style for the contact form and status messages */ #contactform,.statusmessage { color: #666; background-color: #ebedf2; background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#dfe1e5), color-stop(1, #ebedf2) ); background: -moz-linear-gradient( center bottom, #dfe1e5 0%, #ebedf2 100% ); border: 1px solid #aaa; -moz-box-shadow: 0 0 1em rgba(0, 0, 0,.5); -webkit-box-shadow: 0 0 1em rgba(0, 0, 0,.5); box-shadow: 0 0 1em rgba(0, 0, 0,.5); opacity:.95;

4 /* The form dimensions */ #contactform { width: 40em; height: 33em; padding: 0 1.5em 1.5em 1.5em; margin: 0 auto; /* Position the form in the middle of the window (if JavaScript is enabled) */ #contactform.positioned { position: fixed; top: 0; bottom: 0; left: 0; right: 0; margin-top: auto; margin-bottom: auto; /* Dimensions and position of the status messages */.statusmessage { display: none; margin: auto; width: 30em; height: 2em; padding: 1.5em; position: fixed; top: 0; bottom: 0; left: 0; right: 0;.statusMessage p { text-align: center; margin: 0; padding: 0; /* The header at the top of the form */ #contactform h2 { font-size: 2em; font-style: italic;

5 letter-spacing:.05em; margin: 0 0 1em -.75em; padding: 1em; width: 19.5em; color: #aeb6aa; background: #dfe0e5 url('images/stamp.jpg') no-repeat 15em -3em; /* */ border-bottom: 1px solid #aaa; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; /* Give form elements consistent margin, padding and line height */ #contactform ul { list-style: none; margin: 0; padding: 0; #contactform ul li { margin:.9em 0 0 0; padding: 0; #contactform input, #contactform label { line-height: 1em; /* The field labels */ label { display: block; float: left; clear: left; text-align: right; width: 28%; padding:.4em 0 0 0; margin:.15em.5em 0 0; font-weight: bold; /* The fields */ input, textarea { display: block; margin: 0;

6 padding:.4em; width: 67%; font-family: "Georgia", serif; font-size: 1em; border: 1px solid #aaa; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset; -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset; box-shadow: rgba(0,0,0,.2) 0 1px 4px inset; background: #fff; textarea { height: 13em; line-height: 1.5em; resize: none; /* Place a border around focused fields, and hide the inner shadow */ #contactform *:focus { border: 1px solid #66f; outline: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; /* Display correctly filled-in fields with a green background */ input:valid, textarea:valid { background: #dfd; /* The Send and Cancel buttons */ input[type="submit"], input[type="button"] { float: right; margin: 2em 1em 0 1em; width: 10em; padding:.5em; border: 1px solid #666; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -moz-box-shadow: 0 0.5em rgba(0, 0, 0,.8);

7 -webkit-box-shadow: 0 0.5em rgba(0, 0, 0,.8); box-shadow: 0 0.5em rgba(0, 0, 0,.8); color: #fff; background: #0a0; font-size: 1em; line-height: 1em; font-weight: bold; opacity:.7; -webkit-appearance: none; -moz-transition: opacity.5s; -webkit-transition: opacity.5s; -o-transition: opacity.5s; transition: opacity.5s; input[type="submit"]:hover, input[type="submit"]:active, input[type="button"]:hover, input[type="button"]:active { cursor: pointer; opacity: 1; input[type="submit"]:active, input[type="button"]:active { color: #333; background: #eee; -moz-box-shadow: 0 0.5em rgba(0, 0, 0,.8) inset; -webkit-box-shadow: 0 0.5em rgba(0, 0, 0,.8) inset; box-shadow: 0 0.5em rgba(0, 0, 0,.8) inset; input[type="button"] { background: #f33; /* Header/footer boxes */.widebox { clear: both; text-align: center; margin: 70px; padding: 10px; background: #ebedf2; border: 1px solid #333;.wideBox h1 { font-weight: bold; margin: 20px; color: #666;

8 font-size: 1.5em; </style> <!-- Some IE7 hacks and workarounds --> <!--[if lt IE 8]> <style> /* IE7 needs the fields to be floated as well as the labels */ input, textarea { float: right; #formbuttons { clear: both; /* IE7 needs an ickier approach to vertical/horizontal centring with fixed positioning. The negative margins are half the element's width/height. */ #contactform.positioned,.statusmessage { left: 50%; top: 50%; #contactform.positioned { margin-left: -20em; margin-top: -16.5em;.statusMessage { margin-left: -15em; margin-top: -1em; </style> <![endif]--> Mari kita lihat beberapa bagian yang menarik dari CSS: 1. Style untuk contact form dan status messages Kita berikan form dan status kotak yang bagus dan lembut dari atas sampai bawah gradien

9 menggunakan WebKit-gradien dan -moz-linear-gradient, dan kita juga menambahkan drop shadow dengan box-shadow Terakhir, kita memberikan form dan pesan kotak opacity.95 (95%), yang membuat konten berbayang. 2. Posisi form di tengah-tengah window (jika JavaScript diaktifkan) Awalnya, kita hanya menempatkan form inline setelah halaman konten. Hal ini dimaksudkan agar form dapat digunakan pada browser non-javascript-enabled tanpa mendapatkan konten. Namun, untuk JavaScript browser, kita ingin form muncul di tengah jendela, dari atas konten. Pada #contactform.positioned, menggunakan posisi tetap, menetapkan atas, bawah, kiri dan kanan nilai semua ke nol, dan memastikan bahwa semua 4 margin yang ditetapkan untuk auto. Ini berpusat elemen secara horisontal dan vertikal di sebagian besar browser modern. Nanti kita akan menggunakan JavaScript untuk menambahkan positioned class pada form. Header di bagian atas form Form "Send us an ..." header dengan gambar perangko, dengan rule styles #contactform h2 pada header. Kita memberikan teks gaya italic besar dan huruf keluar sedikit ruang. Kita juga menambahkan margin dan padding untuk membuat ruang di sekitar dan di dalam header. Kita menggunakan beberapa margin kiri negatif (-.75em) pada header untuk memotong padding pada form, sehingga header pergi tepat ke tepi kiri form. Kita juga mengatur lebar header untuk 19.5em sehingga sama persis dengan lebar form. 1. Kita juga mengatur warna heading, memberikan background gelap, posisi gambar thepostage stamp di sudut kanan atas, menambahkan bordertipis di bawah, dan menambahkan sudut atas melengkung. 2. Fields Kita memberikan input dan textarea dengan field font yang menarik,border bulat dengan border-radius, dan gentle inner shadow menggunakan box-shadow. Kita juga mengapung label bidang kiri sehingga mereka duduk di samping bidang. Ketika field difokuskan (diklik atau pindah ke dengan tombol Tab), kita memberikan border warna biru dan menghapus shadow. Kita juga menetapkan outline: tidak ada untuk menghapus garis biru ditambah dengan beberapa browser. Terakhir, kita menggunakan: pseudo-class yang valid untuk memberikan field diselesaikan dengan benar background hijau, bagi mereka browser yang mendukung validasi form HTML5. 3. Tombol Kirim dan Batal input [type = "submit"] selects the Send button, while input [type = "tombol"] memilih tombol Batal. Float pada posisi berdampingan, dan menambahkan beberapa margin untuk memberi mereka ruang. Kita berikan fixed width yaitu lebarnya teta[, dan beberapa padding untuk membuat mereka size yang layak. Kita tambahkan rounded border agar batasnya bulat dan drop shadow yang halus, dan tentukan teks dan warna latar belakang. Kita juga buat tombol sedikit transparan (opacity:.7), dan membuat sepenuhnya transparan ketika melayang di atas untuk menyorot mereka. Kita menggunakan transisi CSS memudar opacity perlahan. Terakhir ketika tombol diklik (: aktif) kita

10 bergerak bayangan di dalam tombol untuk memberikan "ditekan" tampilan, dan memberikan skema warna hitam-putih. Pada Tutorial selanjutnya kita akan membuat file PHP untuk mengirimka Sampai Ketemu di Tutorial selanjutnya. Tentang Penulis Sendy PK Saya adalah Programmer yang memiliki impian untuk menguasai dunia kunjungi situs pribadi saya di dan Online Shop saya di

Triswansyah Yuliano

Triswansyah Yuliano Mendesain Menu dengan CSS Triswansyah Yuliano triswansyah_yuliano@yahoo.com http://triswan.wordpress.com Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan

Lebih terperinci

CSS. inheritance (pewarisan)

CSS. inheritance (pewarisan) {CSS} lanjut CSS inheritance (pewarisan) sebuah elemen mewarisi beberapa nilai dari properti yang dimiliki oleh elemen parent-nya http://www.w3.org/tr/css21/cascade.html#inheritance http://www.slideshare.net/diniscorreia/htmlcss-3-introduction-to-css

Lebih terperinci

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 4]

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 4] Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 4] Oleh: Sendy PK Sekarang form sudah dapat berfungsi. Kita dapat membuka halaman di browser, klik link "Send Us an Email" untuk melompat ke

Lebih terperinci

Pemrograman Web PRAKTIKUM 3 CSS. TUJUAN BELAJAR Mahasiswa dapat menggunakan css untuk mengatur gaya tampilan elemenhtml

Pemrograman Web PRAKTIKUM 3 CSS. TUJUAN BELAJAR Mahasiswa dapat menggunakan css untuk mengatur gaya tampilan elemenhtml PRAKTIKUM 3 CSS TUJUAN BELAJAR Mahasiswa dapat menggunakan css untuk mengatur gaya tampilan elemenhtml MATERI Sintaks CSS, cara memakai CSS, jenis-jenis selektor, satuan ukuran, satuan warna, properti

Lebih terperinci

6. HTML & CSS. PTI15010 Pemrograman Web. Agi Putra Kharisma, S.T., M.T. Genap 2014/2015. Desain slide ini dadaptasi dari University of San Fransisco

6. HTML & CSS. PTI15010 Pemrograman Web. Agi Putra Kharisma, S.T., M.T. Genap 2014/2015. Desain slide ini dadaptasi dari University of San Fransisco 6. HTML & CSS PTI15010 Pemrograman Web Agi Putra Kharisma, S.T., M.T. Genap 2014/2015 Desain slide ini dadaptasi dari University of San Fransisco HTML, CSS, JavaScript HTML (Struktur Dokumen) CSS (Tampilan

Lebih terperinci

DASAR-DASAR CSS DASAR-DASAR CSS By: Rohi Abdulloh A. PENGENALAN

DASAR-DASAR CSS DASAR-DASAR CSS By: Rohi Abdulloh A. PENGENALAN DASAR-DASAR CSS DASAR-DASAR CSS 2015 A. PENGENALAN CSS merupakan kependekan dari Cascading Style Sheet yaitu suatu skrip yang digunakan untuk mempercantik tampilan HTML atau mengatur bagaimana elemen HTML

Lebih terperinci

MODUL PRAKTIKUM PEMROGRAMAN WEB (DASAR)

MODUL PRAKTIKUM PEMROGRAMAN WEB (DASAR) MODUL PRAKTIKUM PEMROGRAMAN WEB (DASAR) MATERI KULIAH SEMESTER 3 D3 TEKNIK INFORMATIKA STMIK AMIKOM YOGYAKARTA 2009 Disusun Oleh : ANGGIT DWI HARTANTO, S.KOM MODUL II CASCADING STYLE SHEET (CSS) I. PENGERTIAN

Lebih terperinci

CSS dan Tata Letak Pemrograman Internet (TKE ) Program Studi Teknik Elektro, Unsoed

CSS dan Tata Letak Pemrograman Internet (TKE ) Program Studi Teknik Elektro, Unsoed CSS dan Tata Letak Pemrograman Internet (TKE 074082) Program Studi Teknik Elektro, Unsoed Iwan Setiawan Tahun Ajaran 2011/2012 a, a:visited { text-decoration:none; } a:hover { text-decoration:underline;

Lebih terperinci

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 1]

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 1] Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 1] Oleh: Sendy PK Dalam sebuah website, form kontak sangat penting sebagai komunikasi antara admin dan pengunjung,namun form kontak juga bisa

Lebih terperinci

APLIKASI WEB DAY 3. (Cascading Style Sheets)

APLIKASI WEB DAY 3. (Cascading Style Sheets) APLIKASI WEB DAY 3 (Cascading Style Sheets) VII. Pengenalan Style Sheet Style Sheets merupakan feature yang sangat penting dalam membuat Dynamic HTML. Meskipun bukan merupakan suatu keharusan dalam membuat

Lebih terperinci

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id 1 MODUL PEMOGRAMAN WEB I Oleh: CHALIFA CHAZAR 2 Modul 6 CSS For Layout Tujuan: Mahasiswa mengenal komponen-komponen CSS yang dapat digunakan untuk mengatur tata letak element HTML dalam membangun website

Lebih terperinci

Introduksi. Team Training SMK-TI I-58

Introduksi. Team Training SMK-TI I-58 Introduksi Style Sheet adalah template yang mengontrol pemformatan tag HTML pada halaman web anda. Bila anda telah terbiasa menggunakan Microsoft Word, anda dapat melihat bahwa konsep Style Sheet mirip

Lebih terperinci

Analisa Pada percobaan ini, menunjukan flow dalam kondisi normal atau sesuai dengan default dan sifat masing-masing tag HTML-nya.

Analisa Pada percobaan ini, menunjukan flow dalam kondisi normal atau sesuai dengan default dan sifat masing-masing tag HTML-nya. TUGAS CSS LAYAOUT PRAKTIKUM 6 1. Percobaan 1 Pada percobaan ini, menunjukan flow dalam kondisi normal atau sesuai dengan default dan sifat masing-masing tag HTML-nya. 2. Percobaan2 Position: relative;

Lebih terperinci

CSS RANDY CAHYA WIHANDIKA, S.ST., M.KOM

CSS RANDY CAHYA WIHANDIKA, S.ST., M.KOM CSS RANDY CAHYA WIHANDIKA, S.ST., M.KOM CSS Cascading Style Sheet Bahasa yang digunakan untuk mengatur tampilan dan format dari dokumen markup (HTML) CSS didesain untuk memisahkan antara dokumen yang mendeskripsikan

Lebih terperinci

XHTML dan Dasar-dasar CSS XHTML

XHTML dan Dasar-dasar CSS XHTML XHTML dan Dasar-dasar CSS Pemrograman Web Rosa Ariani Sukamto Email: rosa_if_itb_01@yahoo.com Blog: http://udinrosa.wordpress.com Website: http://www.gangsir.com XHTML Extensible Hypertext Markup Language

Lebih terperinci

MEMBUAT WEBSITE SEDERHANA DENGAN HTML 5

MEMBUAT WEBSITE SEDERHANA DENGAN HTML 5 MEMBUAT WEBSITE SEDERHANA DENGAN HTML 5 NELI WIDI ASTUTI Neliwidiastuti97@gmail.com Abstrak Pada kesempatan ini saya akan mencoba menjelaskan tentang membuat website sederhana dengan HTML 5 dan CSS 3,

Lebih terperinci

Notifikasi Keren dengan CSS3

Notifikasi Keren dengan CSS3 Notifikasi Keren dengan CSS3 Oleh: Sendy PK Notifikasi pada website merupakan hal yang penting untuk memberi tahu pengunjung website tentang informasi singkat yang diberikan oleh pemilik website, hal ini

Lebih terperinci

Langkah Cara Membuat Form Login Menggunakan PHP dan MySQL Langkah 1: Membuat Tabel MySQL User/Pengguna

Langkah Cara Membuat Form Login Menggunakan PHP dan MySQL Langkah 1: Membuat Tabel MySQL User/Pengguna Dalam tutorial cara membuat form login dengan PHP dan MySQL, kita akan belajar membuat halaman login untuk website dengan menggunakan PHP Session. Tutorial ini merupakan tutorial tingkat dasar, sederhana

Lebih terperinci

DAFTAR ISI Bab 1 Mengenal Teknologi Internet dan Web... 1 Bab 2 Tentang CSS... 9

DAFTAR ISI Bab 1 Mengenal Teknologi Internet dan Web... 1 Bab 2 Tentang CSS... 9 DAFTAR ISI Kata Pengantar... vii Daftar Isi... ix Bab 1 Mengenal Teknologi Internet dan Web... 1 1.1 Sejarah Internet...1 1.2 Web dan Browser...3 1.3 Mengenal Teknologi Web...4 1.4 Sekilas Tentang HTML...5

Lebih terperinci

BAB IV CASCADING STYLE SHEET (CSS)

BAB IV CASCADING STYLE SHEET (CSS) BAB IV CASCADING STYLE SHEET (CSS) A. KOMPETENSI DASAR Memahami jenis dan struktur dasar dokumen CSS dan CSS3. Mampu memanfaatkan CSS untuk memformat dokumen HTML. Mampu memanfaatkan pendekatan CSS untuk

Lebih terperinci

Tutorial Membuat Template Joomla 1.5

Tutorial Membuat Template Joomla 1.5 Tutorial Membuat Template Joomla 1.5 Tempate joomla sebenarnya sangat sederhana, tidak rumit sama sekali. Satu file layout html bisa kita konversi langsung menjadi template joomla 1.5 yang valid. Tutorial

Lebih terperinci

LEMBAR KERJA PRAKTIKUM. - JavaScript Alert yang ditampilkan browser saat membuka halaman home/index.html :

LEMBAR KERJA PRAKTIKUM. - JavaScript Alert yang ditampilkan browser saat membuka halaman home/index.html : LEMBAR KERJA PRAKTIKUM Nim : 13-1401-164 Hari / Tgl TTD Asisten Nama Kelas : Muh. Idrus : DK-13 Mata kuliah : Pemrograman Web I Materi : JavaScript - JavaScript Alert yang ditampilkan browser saat membuka

Lebih terperinci

CSS Cascading Style Sheet

CSS Cascading Style Sheet CSS Cascading Style Sheet Pengenalan CSS CSS adalah singkatan dari Cascading Style Sheets CSS (Cascading Style Sheet) digunakan untuk melengkapi file HTML, dan tugas utamanya adalah menetapkan aturan tampilan/style

Lebih terperinci

Cara Membuat website dengan Dreamweaver

Cara Membuat website dengan Dreamweaver Cara Membuat website dengan Dreamweaver Pajrin Wurika Sahara Wurika.sahara@gmail.com Abstrak Dreamweaver adalah software aplikasi desain web visual yang biasa dikenal dengan istilah WYSIWYG What You See

Lebih terperinci

Teks dan Background SERIF SANS-SERIF MONOSPACE

Teks dan Background SERIF SANS-SERIF MONOSPACE Tujuan Teks dan Background Mahasiswa dapat memahami pengaturan teks melalui CSS Mahasiswa dapat memahami berbagai jenis ukuran teks Mahasiswa dapat memahami pengaturan background melalui CSS Dasar Teori

Lebih terperinci

Percobaan 1 : Mengatur Width Dan Height Hasil :

Percobaan 1 : Mengatur Width Dan Height Hasil : Percobaan 1 : Mengatur Width Dan Height Analisa : Terlihat di atas kalau width dan height dari tag dan berbeda sesuai value yang telah diinputkan yang bias dibedakan dengan background-color

Lebih terperinci

MATERI II CASCADING STYLE SHEETS (CSS) DASAR

MATERI II CASCADING STYLE SHEETS (CSS) DASAR MATERI II CASCADING STYLE SHEETS (CSS) DASAR Tujuan : 1. Memahami tentang konsep CSS 2. Memahami aturan penulisan pada CSS 3. Memahami selector sebagai pengontrol design 4. Memahami pembuatan background

Lebih terperinci

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) - Konsep dasar CSS - CSS properties Definisi Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) adalah suatu teknologi yang digunakan untuk memperindah halaman website

Lebih terperinci

TUGAS BOXES. 1. Percobaan 1

TUGAS BOXES. 1. Percobaan 1 TUGAS BOXES 1. Percobaan 1 Analisa : Pada percobaan 1, style pada elemen div ditetapkan width dan heightnya 400px dan 300px dengan background color pink, dan pada elemen p, width dan height ditetapkan

Lebih terperinci

TUGAS UTS WEB STATIS. : Apriyanto Wibowo NIM : : Teknik Informatika S1 (Malam) Pengertian framework

TUGAS UTS WEB STATIS. : Apriyanto Wibowo NIM : : Teknik Informatika S1 (Malam) Pengertian framework TUGAS UTS WEB STATIS Nama : Apriyanto Wibowo NIM : 12141362 Prodi Mata Kuliah : Teknik Informatika S1 (Malam) : Pemrograman Web Statis Pengertian framework Framework adalah kerangka kerja. Framework juga

Lebih terperinci

Membuat Button Dengan CSS

Membuat Button Dengan CSS Membuat Button Dengan CSS Dari sekian banyak pertanyaan yang muncul dari para pemula di CSS adalah pertanyaan bagaimana sih membuat tombol dengan CSS?, hmmm bagi saya ini adalah pertanyaan yang simple

Lebih terperinci

CSS. Auriza Akbar 1 Juni 2012

CSS. Auriza Akbar 1 Juni 2012 CSS Auriza Akbar auriza.akbar@gmail.com 1 Juni 2012 Apa itu CSS? CSS = Cascading Style Sheets Mekanisme sederhana untuk menambahkan style (seperti font, warna, spasi) ke dalam dokumen web http://www.w3.org/style/css/

Lebih terperinci

BAB III CASCADING STYLE SHEET

BAB III CASCADING STYLE SHEET BAB III CASCADING STYLE SHEET A. KOMPETENSI DASAR Memahami jenis dan struktur dasar dokumen CSS dan CSS3. Mampu memanfaatkan CSS untuk memformat dokumen HTML. Mampu memanfaatkan pendekatan CSS untuk menghasilkan

Lebih terperinci

BAB V IMPLEMENTASI SISTEM

BAB V IMPLEMENTASI SISTEM BAB V IMPLEMENTASI SISTEM Pada bab ini merupakan tahapan penerjemahan kebutuhan pembuatan software ke dalam representasi perangkat lunak sebeleum penulisan kode program dimulai sesuai dengan hasil analisis

Lebih terperinci

A. LATAR BELAKANG ATAU BACKGROUND

A. LATAR BELAKANG ATAU BACKGROUND A. LATAR BELAKANG ATAU BACKGROUND Latar belakang background dalam CSS dibedakan menjadi 2: 1. Latar Belakang Dengan Menggunakan Warna: Warna background memiliki dua nilai: Transparent : membuat wearna

Lebih terperinci

Author : Minarni, S.Kom.,MM

Author : Minarni, S.Kom.,MM S Cascading Style Sheets Author : Minarni, S.Kom.,MM Universitas Darwan Ali Sampit Kalimantan Tengah Internet Multimedia Keuntungan Menggunakan CSS Mempermudah dan mempersingkat pembuatan dan pemeliharaan

Lebih terperinci

PERTEMUAN 2. Melakukan Pengaturan Pada Halaman

PERTEMUAN 2. Melakukan Pengaturan Pada Halaman 2.1 Membuat Bingkai Pada Halaman PERTEMUAN 2 Melakukan Pengaturan Pada Halaman Untuk mempercantik dokumen, kita bisa menambahkan bingkai pada halaman dengan cara: Tandai teks yang akan diberi bingkai Klik

Lebih terperinci

Cascading Style Sheet (CSS) Didik Dwi Prasetya

Cascading Style Sheet (CSS) Didik Dwi Prasetya Cascading Style Sheet (CSS) Didik Dwi Prasetya didikdwi@gmail.com CSS vcss à Cascading Style Sheet vstyle à mendefinisikan aturan untuk menampilkan elemen HTML. vdefinisi: Cascading Style Sheets (CSS)

Lebih terperinci

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 5]

Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 5] Membuat Form Kontak yang Indah dan Atraktif dengan AJAX [Part 5] Oleh: Sendy PK Sekarang kita telah menyiapkan form bukannya di-submit dengan cara yang biasa, itu akan memicu fungsi submitform () ketika

Lebih terperinci

/* styling paragraf, teks paragraf berwarna biru dan rata tengah */ p {color:blue;text-align:center;}

/* styling paragraf, teks paragraf berwarna biru dan rata tengah */ p {color:blue;text-align:center;} II CSS INTRO CSS (Cascading Style Sheet) adalah bahasa untuk mendefinisikan bagaimana suatu dokumen dan elemen pada suatu dokumen ditampilkan oleh browser. File CSS memiliki ekstensi.css SYNTAX SYNTAX

Lebih terperinci

MEMBUAT TEMPLATE LIBREOFFICE WRITER

MEMBUAT TEMPLATE LIBREOFFICE WRITER MEMBUAT TEMPLATE LIBREOFFICE WRITER Membuat Page Style 1. Buka file baru pada Libreoffice. 2. Pada menu bar, pilih Format > Styles and Formatting (F11) 3. Pada dialog box Styles and Formatting yang telah

Lebih terperinci

MODUL PRATIKUM 04B PEMROGRAMAN BERBASIS WEB (CCP119)

MODUL PRATIKUM 04B PEMROGRAMAN BERBASIS WEB (CCP119) MODUL PRATIKUM 04B PEMROGRAMAN BERBASIS WEB (CCP119) Disusun oleh : KARTINI, SKom.,MMSI LABORATORIUM KOMPUTER FAKULTAS ILMU KOMPUTER UNIVERSITAS ESA UNGGUL MODUL PRATIKUM PBW 04B CSS : Layout dan Posisi

Lebih terperinci

CSS. Cascading Style Sheet. Spesifikasi lengkap di :

CSS. Cascading Style Sheet. Spesifikasi lengkap di : CSS Cascading Style Sheet Spesifikasi lengkap di : http://www.w3..org/tr/css2 Mengubah Text Mengubah Warna Mengubah Posisi Mengubah Ukuran Bagaimana cara menempatkan CSS? Ada 3 cara yaitu : Inline ( pada

Lebih terperinci

MACROMEDIA DREAMWEAVER 8

MACROMEDIA DREAMWEAVER 8 MACROMEDIA DREAMWEAVER 8 Macromedia Dreamweaver adalah program untuk membuat dan mengedit dokumen HTML secara visual dan mengelola halaman sebuah situs. Dreamweaver menyediakan banyak perangkat yang berkaitan

Lebih terperinci

MODUL III CASCADING STYLE SHEET

MODUL III CASCADING STYLE SHEET MODUL III CASCADING STYLE SHEET A. TUJUAN Memahami struktur dasar dokumen HTML. Mampu membuat dokumen HTML yang baik dan benar. Mampu memanfaatkan elemen-elemen dasar untuk menampilkan informasi. B. PETUNJUK

Lebih terperinci

CSS Layouting. Antonius RC Pemrograman Web

CSS Layouting. Antonius RC Pemrograman Web CSS Layouting Antonius RC Pemrograman Web CSS Selector Tambahan Tanda > artinya select child element Contoh: ul > li Maka akan terambil 2 elemen li CSS Selector Tambahan Tanda + artinya select adjecent

Lebih terperinci

BAB V DESAIN WEB CSS

BAB V DESAIN WEB CSS BAB V DESAIN WEB CSS A. KOMPETENSI DASAR Memahami konsep dan strategi desain web yang rapi berbasis HTML dan CSS/CSS3. Mampu mengoptimalkan fitur-fitur CSS dalam desain web. Mampu memanfaatkan pendekatan

Lebih terperinci

LAPORAN RESMI. Boxes

LAPORAN RESMI. Boxes LAPORAN RESMI Boxes Dosen Pembimbing : Dwi Susanto,ST, MT Oleh Hamidah Nur Hidayati 4103131038 PROGRAM STUDI TEKNOLOGI MULTIMEDIA BROADCASTING DEPARTEMEN MULTIMEDIA KREATIF POLITEKNIK ELEKTRONIKA NEGERI

Lebih terperinci

TUTORIAL WEBDESIGN HTML & CSS DENGAN DREAMWEAVER

TUTORIAL WEBDESIGN HTML & CSS DENGAN DREAMWEAVER 1 TUTORIAL WEBDESIGN HTML & CSS DENGAN DREAMWEAVER Membuat website statis dengan menggunakan Dreamweaver tools sebagai editor dengan membuat dokumen XHTML dan CSS sebagai style library external. Rencana

Lebih terperinci

MODUL 1 STYLE SHEET UNTUK TAMPILAN DASAR

MODUL 1 STYLE SHEET UNTUK TAMPILAN DASAR MODUL 1 STYLE SHEET UNTUK TAMPILAN DASAR PENDAHULUAN Setelah semua yang Anda ketahui tentang dasar pembuatan halaman Web dalam perkuliahan sebelumnya, kini tiba saatnya untuk membuat halaman web Anda tampil

Lebih terperinci

BAB VI DESAIN WEB RESPONSIF

BAB VI DESAIN WEB RESPONSIF BAB VI DESAIN WEB RESPONSIF A. KOMPETENSI DASAR Memahami konsep dasar desain halaman web responsif Mampu menerapkan konsep desain web responsif ke dalam aplikasi Mampu menghasilkan desain aplikasi web

Lebih terperinci

CSS (CASCADING STYLE SHEET)

CSS (CASCADING STYLE SHEET) CSS (CASCADING STYLE SHEET) CSS DASAR Tentang CSS Kegunaan CSS Aturan Penulisan CSS Background CSS Font CSS Teks CSS Border Margin Contoh Layout Web menggunakan CSS 1 Tentang CSS CSS (Cascading Style Sheet)

Lebih terperinci

CSS BOXES. Langkah Kerja. Percobaan

CSS BOXES. Langkah Kerja. Percobaan Tugas : Percobaan Praktikum 8 Materi : CSS Boxes Nama : Dwi Setiya Ningsih NRP : 2103157025 Langkah Kerja CSS BOXES Berikut ini langkah kerja yang perlu anda lakukan selama menyelesaikan semua percobaan

Lebih terperinci

PROPERTIES. Pemrograman Web Teknik Informatika Fakultas Teknologi Industri

PROPERTIES. Pemrograman Web Teknik Informatika Fakultas Teknologi Industri PROPERTIES 12 Font Syntax: font: Properti Font Possible Values: [ ]? [ / ]? Contoh: P { font: italic bold 12pt/14pt

Lebih terperinci

Design Web 2 Kolom Flexible

Design Web 2 Kolom Flexible Design Web 2 Kolom Flexible Muh Hasan Tanjung recosmic@gmail.com Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan komersial

Lebih terperinci

2011 Ahmad Amarullah

2011 Ahmad Amarullah 1 Silabus Mata Kuliah Program Studi : Sistem Informasi Kode Mata Kuliah : Nama Mata Kuliah : Komputer Aplikasi IT ( XHTML & CSS ) Jumlah SKS : 2 SKS Semester : 1 Deskripsi Mata Kuliah : Mata kuliah ini

Lebih terperinci

FLASH, FRAME, BEHAVIOR

FLASH, FRAME, BEHAVIOR FLASH, FRAME, BEHAVIOR 1. Flash Menyisipkan Flash Button a. Pilih menu : insert image interactive flash button b. Tentukan property : Style : pilih bentuk / jenis tombol flash Button text : tulis label

Lebih terperinci

Membangun website dinamis berbasis PHP-mySQL (3)

Membangun website dinamis berbasis PHP-mySQL (3) Membangun website dinamis berbasis PHP-mySQL (3) Agus Subardjo multigraphica@yahoo.com http://multigraphica.com Lisensi Dokumen: Copyright 2011-2015 IlmuKomputer.Com Seluruh dokumen di IlmuKomputer.Com

Lebih terperinci

Header-Footer, Preview dan Cetak Dokumen

Header-Footer, Preview dan Cetak Dokumen Header-Footer, Preview dan Cetak Dokumen BAB 4 Pada Bab ini anda akan mempelajari cara: Membuat header dan footer Membuat nomor halaman pada header Menambahkan informasi pada footer Mengatur ukuran halaman

Lebih terperinci

PERTEMUAN IV MEMBUAT JUDUL (TITLE)

PERTEMUAN IV MEMBUAT JUDUL (TITLE) PERTEMUAN IV MEMBUAT JUDUL (TITLE) Tujuan Praktikum: 1. Mahasiswa mampu menyisipkan/menambahkan Judul (Title) pada clip video; 2. Mahasiswa mampu mengubah/edit Judul (Title) pada clip video dengan berbagai

Lebih terperinci

Tutorial Lengkap Memahami CSS Display

Tutorial Lengkap Memahami CSS Display Tutorial Lengkap Memahami CSS Display Oleh: Christian Rosandhy Dalam dunia CSS, property Display adalah salah satu property terpenting yang menentukan hasil akhir sebuah website. Kali ini kita akan banyak

Lebih terperinci

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id 1 MODUL PEMOGRAMAN WEB I Oleh: CHALIFA CHAZAR 2 Modul 6 CSS3 Tujuan: Mahasiswa mengenal komponen CSS 3 sebagai pelengkap element HTML dalam membangun website statis. Pustaka:» HTML dan XML Edisi 2: Betha

Lebih terperinci

KELAS TANGGAL PRAKTIKUM

KELAS TANGGAL PRAKTIKUM PRAKTIKUM NAMA KELAS TANGGAL PRAKTIKUM : Margins, Padding dan Dimensi : : : A. TUJUAN 1. Siswa dapat mengenal, memahami serta dapat melakukan pengaturan margin dan padding. 2. Siswa dapat mengenal, memahami

Lebih terperinci

LAPORAN RESMI Layout

LAPORAN RESMI Layout LAPORAN RESMI Layout Dosen Pembimbing : Dwi Susanto,ST, MT Oleh Hamidah Nur Hidayati 4103131038 PROGRAM STUDI TEKNOLOGI MULTIMEDIA BROADCASTING DEPARTEMEN MULTIMEDIA KREATIF POLITEKNIK ELEKTRONIKA NEGERI

Lebih terperinci

LAPORAN RESMI PRAKTIKUM TEKNOLOGI WEB PENGENALAN CSS OLEH : LISTHYA KUMALASARI

LAPORAN RESMI PRAKTIKUM TEKNOLOGI WEB PENGENALAN CSS OLEH : LISTHYA KUMALASARI LAPORAN RESMI PRAKTIKUM TEKNOLOGI WEB PENGENALAN CSS OLEH : LISTHYA KUMALASARI 4103131060 PROGRAM STUDI TEKNOLOGI MULTIMEDIA BROADCASTING DEPARTEMEN MULTIMEDIA KREATIF POLITEKNIK ELEKTRONIKA NEGERI SURABAYA

Lebih terperinci

Membuat Template Website Menggunakan Teknik Layer ala CSS

Membuat Template Website Menggunakan Teknik Layer ala CSS Membuat Template Website Menggunakan Teknik Layer ala CSS Bila Anda mendengar istilah template website, hampir dapat dipastikan kalau skrip yang digunakannya adalah CSS. CSS atau Cascading Style Sheet

Lebih terperinci

{CSS} Cascading Style Sheet

{CSS} Cascading Style Sheet {CSS} Cascading Style Sheet mekanisme sederhana yang mengatur gaya / style (cth: warna, ukuran, posisi, dll) pada halaman web. http://www.w3.org/style/css sebelum CSS sebelum CSS sebelum CSS sebelum

Lebih terperinci

Penggunaan CSS dalam Perancangan Web

Penggunaan CSS dalam Perancangan Web Pendahuluan Penggunaan CSS dalam Perancangan Web CSS yang memiliki kepanjangan Cascade Style Sheet ini digunakan para web designer untuk mengatur style elemen yang ada dalam halaman web mereka, mulai dari

Lebih terperinci

Bab 4 Melengkapi dan Mencetak Spreadsheet

Bab 4 Melengkapi dan Mencetak Spreadsheet Bab 4 Melengkapi dan Mencetak Spreadsheet Pada Bab ini anda akan mempelajari cara: Membuat header dan footer Membuat diagram dari tabel Modifikasi diagram Preview dokumen Mengatur ukuran halaman pada jendela

Lebih terperinci

setiap value dipisakan dengan,(koma) dan maksud dari kedua value ini ialah manambah efek dengan dua value tadi.

setiap value dipisakan dengan,(koma) dan maksud dari kedua value ini ialah manambah efek dengan dua value tadi. PERTEMUAN 6 .classshadow font-family: color:#333333; text-shadow: 1px 2px 3px blue; 1px adalah tebal bayangan secara horisontal, kekanan untuk nilai (+) dan kekiri untuk nilai (-), misal -1px; 2px adalah

Lebih terperinci

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) - Konsep dasar CSS - CSS properties Definisi Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) adalah suatu teknologi yang digunakan untuk memperindah halaman website

Lebih terperinci

pengayaan dan penomoran PENGAYAAN (STYLE)

pengayaan dan penomoran PENGAYAAN (STYLE) pengayaan dan penomoran PENGAYAAN (STYLE) Pada umumnya orang menyusun dokumen berdasarkan atribut fisik. Sebagai contoh, jenis huruf, ukuran huruf, dan ketebalan (misalnya Times New Roman 12 pt, italic).

Lebih terperinci

buat Lightbox mu sendiri dengan jquery

buat Lightbox mu sendiri dengan jquery buat Lightbox mu sendiri dengan jquery Oleh: putra surya herlambang assalamualikum wr wb. apakah kamu pernah melihat gambar pada website yang ketika kamu klik lalu akan muncul suatu kotak besar yang juga

Lebih terperinci

Membuat Form Search Dengan CSS3

Membuat Form Search Dengan CSS3 Membuat Form Search Dengan CSS3 Oleh: Irvansyah Pasti teman2 sering dong berkunjung ke blog ataupun malah di blog teman2 ada yang namanya Form Searh.. Apa itu Form Search..?? Yup bnar sekali.. Sebuah media

Lebih terperinci

MODUL 5 MACROMEDIA FIREWORKS

MODUL 5 MACROMEDIA FIREWORKS MODUL 5 MACROMEDIA FIREWORKS Tujuan : 1. Memahami penggunaan Fireworks dalam mendesign suatu web. 2. Memahami pembuatan tombol dalam Fireworks. 3. Memahami langkah-langkah pembuatan Fireworks dari awal.

Lebih terperinci

Format dan Formula. Pada Bab ini anda akan mempelajari cara:

Format dan Formula. Pada Bab ini anda akan mempelajari cara: BAB Format dan Formula 7 Pada Bab ini anda akan mempelajari cara: Format sel secara manual Format atribut dan pembatas sel Merapikan tampilan dengan format Format untuk angka-angka Memformat angka sebagai

Lebih terperinci

Mencari Text 2) 3) KTI A : Week 02 (Pembuatan Dokumen)

Mencari Text 2) 3) KTI A : Week 02 (Pembuatan Dokumen) 1 Mencari Text Untuk mencari sebuah text secara cepat, gunakan fasilitas Find and Replace, yang dapat dipanggil melalui menu Edit Find atau Ctrl+F. Hasilnya adalah : 4) Mencari untuk Highlight : menandai

Lebih terperinci

1. Agar bagian yang ditunjuk anak panah bisa ditampilkan pada browser, perintah yang digunakan adalah.

1. Agar bagian yang ditunjuk anak panah bisa ditampilkan pada browser, perintah yang digunakan adalah. A SOAL PILIHAN GANDA 1 Agar bagian yang ditunjuk anak panah bisa ditampilkan pada browser, perintah yang digunakan adalah A ikan Badut (Clownfish) B ikan Badut (Clownfish) C

Lebih terperinci

Gambar 3.1 Kotak Dialog Font & Character Spacing

Gambar 3.1 Kotak Dialog Font & Character Spacing EDITING Agar web site menarik & banyak dikunjungi, yang perlu diperhatikan adalah tampilannya, baru kemudian isinya. Maka, membuat web site semenarik mungkin merupakan keharusan, agar menarik pengunjung

Lebih terperinci

MODUL III CASCADING STYLE SHEET

MODUL III CASCADING STYLE SHEET MODUL III CASCADING STYLE SHEET A. TUJUAN Memahami jenis dan struktur dasar dokumen CSS. Mampu memanfaatkan CSS untuk memformat dokumen HTML. Mampu memanfaatkan pendekatan CSS untuk menghasilkan halaman

Lebih terperinci

Editing Video Menggunakan Adobe Premiere Pro

Editing Video Menggunakan Adobe Premiere Pro Editing Video Menggunakan Adobe Premiere Pro Winastwan Gora S. redaksi@belajarsendiri.com BAB IX. MEMBUAT TITLE Lisensi Dokumen : Hak Cipta 2006 BelajarSendiri.Com Seluruh dokumen ini dapat digunakan,

Lebih terperinci

TUGAS PRAKTIKUM 9. Nama : Surya Wahyusantoso NRP : Percobaan 1 Mengatur tampilan tipe list. Analisa :

TUGAS PRAKTIKUM 9. Nama : Surya Wahyusantoso NRP : Percobaan 1 Mengatur tampilan tipe list. Analisa : TUGAS PRAKTIKUM 9 Nama : Surya Wahyusantoso NRP : 2103157024 1. Percobaan 1 Mengatur tampilan tipe list Gambar di atas Menggunakan Value lower-roman dari property CSS list-style-type membuat tampilan bullet

Lebih terperinci

Panduan Lengkapp HTML dan CSS bagian 2 Wahyu Setiyono

Panduan Lengkapp HTML dan CSS bagian 2 Wahyu Setiyono Panduan HTML dan CSS bagian 2 A. Apa itu CSS CSS (Cascading Style Sheets) merupakan kode pemrograman untuk membuat tampilan pada HTML. Selain menggunakan HTML para programer website sering menggunakan

Lebih terperinci

[ KP215 - Otomasi Perkantoran ]

[ KP215 - Otomasi Perkantoran ] [ KP215 - Otomasi Perkantoran ] Pengayaan dan Penomoran [KP215 - Otomasi Perkantoran] Pengayaan dan Penomoran Chapter 2 3.1 PENGAYAAN (STYLE) Pada umumnya orang menyusun dokumen berdasarkan atribut fisik.

Lebih terperinci

Bab 9 Menggunakan Tabel

Bab 9 Menggunakan Tabel Bab 9 Menggunakan Tabel Webmaster Pro Front Page XP Daftar Isi Bab 9 1 Membuat sebuah tabel...284 1.1 Cara pertama membuat tabel... 284 1.2 Cara kedua membuat tabel... 286 1.3 Cara ketiga membuat tabel...

Lebih terperinci

Modul Praktikum 2 Dasar-Dasar Teknologi Informasi dan Komunikasi. Mengolah Kata Dengan Microsoft Word (1)

Modul Praktikum 2 Dasar-Dasar Teknologi Informasi dan Komunikasi. Mengolah Kata Dengan Microsoft Word (1) A. Mengenal Microsoft Word Mengolah Kata Dengan Microsoft Word (1) Microsoft Word (MS Word) merupakan program untuk mengolah kata. Program ini bisa digunakan untuk menulis dokumen misalnya karya tulis,

Lebih terperinci

LATIHAN OPTIMASI GAMBAR TRAINING PRESENTASI MEMUKAU

LATIHAN OPTIMASI GAMBAR TRAINING PRESENTASI MEMUKAU LATIHAN OPTIMASI GAMBAR TRAINING PRESENTASI MEMUKAU LATIHAN MENCARI GAMBAR DI GOOGLE 1. Buka browser dan ketik google.com atau google.co.id 2. Klik images 3. Masukkan kata kunci gambar yang Anda cari dan

Lebih terperinci

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id

MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id 1 MODUL PEMOGRAMAN WEB I Oleh: CHALIFA CHAZAR 2 Modul 3 HTML Layout Tujuan: Mahasiswa mengenal konsep-konsep dan komponen layout dasar untuk membangun website statis. Pustaka:» HTML dan XML Edisi 2: Betha

Lebih terperinci

BAB 2 Teks dan Paragraph

BAB 2 Teks dan Paragraph BAB 2 Teks dan Paragraph Pada Bab ini anda akan mempelajari cara: Memilih tampilan untuk bekerja dalam dokumen Memotong, menyalin dan menempelkan teks Mengubah tampilan teks Menambahkan efek pada teks

Lebih terperinci

Microsoft Word Bagian I

Microsoft Word Bagian I APLIKASI KOMPUTER Modul ke: Microsoft Word Bagian I Fakultas Teknik Program Studi Elektro www.mercubuana.ac.id I b r a h i m, S.T, M.T. Ibra.lammada@gmail.com Pengertian Sejauh ini kita sudah sedikit banyak

Lebih terperinci

Membuka Ms. Word 2007

Membuka Ms. Word 2007 Ms. Word 2007: Menu Bar Home & Page Layout Laboratorium Komputer Universitas Esa Unggul 2013 Membuka Ms. Word 2007 1. Klik Start Menu. 2. Sorot/klik All Programs. 3. Sorot/klik Microsoft Office. 4. Klik

Lebih terperinci

Area kerja. Gambar 1. Tampilan awal MS FrontPage

Area kerja. Gambar 1. Tampilan awal MS FrontPage Microsoft FrontPage I. Mengenal Microsoft FrontPage Microsoft FrontPage (MS FrontPage) adalah sebuah program untuk membuat, mendesain, dan mengedit halaman World Wide Web seperti menambahkan text, images,

Lebih terperinci

Multiple Style akan meng-cascade kedalam Style Lain

Multiple Style akan meng-cascade kedalam Style Lain CSS Pendahuluan Apakah CSS? CSS singkatan dari Cascading Style Sheets Styles mendefinisikan bagaimana menampilkan elemen Styles umumnya disimpan dalam Style Sheets Styles ditambahkan pada HTML 4.0 untuk

Lebih terperinci

Kostumisasi Fitur Twitter Bootstrap 3 - Episode Carousel / Slide

Kostumisasi Fitur Twitter Bootstrap 3 - Episode Carousel / Slide Kostumisasi Fitur Twitter Bootstrap 3 - Episode Carousel / Slide Oleh: Muhammad Fauzi Seperti yang kita ketahui twitter bootstrap menyediakan beberapa fitur javascript dan user tinggal menggunakannya,

Lebih terperinci

Keuntungan Memisahkan presentation sebuah dokumen dari content document itu sendiri Mempermudah dan mempersingkat pembuatan dan pemeliharaan dokumen w

Keuntungan Memisahkan presentation sebuah dokumen dari content document itu sendiri Mempermudah dan mempersingkat pembuatan dan pemeliharaan dokumen w Tentang CSS Adalah standart pembuatan dan pemakaian style untuk dokumen terstruktur, CSS digunakan untuk mempersingkat penulisan tag HTML seperti font, color, text dan table menjadi lebih ringkas sehingga

Lebih terperinci

Bab 3 Format dan Formula

Bab 3 Format dan Formula Bab 3 Format dan Formula Pada Bab ini anda akan mempelajari cara: Format sel secara manual Format atribut dan pembatas sel Merapikan tampilan dengan format Format untuk angka-angka Memformat angka sebagai

Lebih terperinci

A. LATAR BELAKANG ATAU BACKGROUND

A. LATAR BELAKANG ATAU BACKGROUND A. LATAR BELAKANG ATAU BACKGROUND Latar belakang background dalam CSS dibedakan menjadi 2: 1. Latar Belakang Dengan Menggunakan Warna: Warna background memiliki dua nilai: Transparent : membuat wearna

Lebih terperinci

Modul ke: Aplikasi Komputer. Microsoft Word 2010 Bagian 1. Fakultas FASILKOM. Nurhaida, ST. MT. Program Studi MKCU

Modul ke: Aplikasi Komputer. Microsoft Word 2010 Bagian 1. Fakultas FASILKOM. Nurhaida, ST. MT. Program Studi MKCU Modul ke: 04 Ida Fakultas FASILKOM Aplikasi Komputer Microsoft Word 2010 Bagian 1 Nurhaida, ST. MT. Program Studi MKCU Word 2010 Fitur-fitur terbaru yang diberikan Word 2010 Autocorrect MailMerge Auto

Lebih terperinci

7 Cara Mempercantik Tampilan Blog

7 Cara Mempercantik Tampilan Blog 7 Cara Mempercantik Tampilan Blog Primo Riveral primo@raharja.info Abstrak Memiliki blog dengan tampilan keren dan enak dilihat tentu pasti menjadi kembanggaan tersendiri untuk seorang yang menggemari

Lebih terperinci

TAKEN FROM ROSIHANARI.NET

TAKEN FROM ROSIHANARI.NET TAKEN FROM ROSIHANARI.NET Pendahuluan CSS yang memiliki kepanjangan Cascade Style Sheet ini digunakan para web designer untuk mengatur style elemen yang ada dalam halaman web mereka, mulai dari memformat

Lebih terperinci