Secara garis besar, kompresi merupakan proses untuk menghilangkan berbagai kerumitan yang tidak penting (redundansi) dari suatu informasi dengan cara memadatkan isi file sehingga ukurannya menjadi lebih kecil dengan memaksimalkan kesederhanaannya dan tetap menjaga kualitas penggambaran dari informasi tersebut. Kompresi data menjadi sangat penting karena memperkecil kebutuhan penyimpanan data, mempercepat pengiriman data, memperkecil kebutuhan bandwith.Teknik kompresi bisa dilakukan terhadap data teks/biner, gambar (JPEG, PNG, TIFF), audio (MP3, AAC, RMA, WMA), dan video (MPEG, H261, H263).
Langkah-Langkah Pembuatan Aplikasi Kompresi
Aplikasi kompresi yang kami buat, menggunakan MATLAB 7, yaitu software yang digunakan sebagai alat pemrograman standar bidang matematika, rekayasa dan keilmuan yang terkait. MATLAB menyediakan beberapa pilihan untuk dipelajari yaitu metode visualisasi dan pemrograman.. Ada beberapa tahap dalam pembuatannya, tahap pertama adalah membuat design figure sseperti gambar berikut
Design figure merupakan tahap untuk mendesain tampilan dari aplikasi yang akan dibuat. Ada beberapa component palette yang digunakan, yaitu dua buah axes untuk menampilkan gambar asli dan gambar hasil konversi. Kemudian ada beberapa static text untuk menampilkan nama file dan ukuran dari gambar yang dibuka serta yang telah di kompressi. Selain itu ada pula pushbutton yang berfungsi untuk menyediakan menu dari aplikasi ini yaitu, buka gambar, kompres, dan keluar. Untuk mengedit atau mengatur component pallet, klik dua kali pada pallete yang ingin diedit dan akan keluar tampilan property inspector
Setelah membuat desain, selanjutnya adalah membuat source code program. Untuk memulai membuatnya, buka layout figure yang telah dibuat kemudian klik kanan pada figure dan pilih M-file, kemudian ketik source code pada editor M-file Pada function buka_Callback, kita ketikkan source code seperti berikut
script tersebut menjelaskan bahwa pada function buka_Callback terdapat fungsi uigetfile yang digunakan untuk membaca file citra dengan format yang ditentukan yaitu *.bmp, *.jpg sebagai filter. Berikutnya ketikkan script berikut pada function kompres_Callback
[nama_file_simpan, path_simpan]=uiputfile(... {'*.jpg','File citra(*.jpg)'; '*.jpg','Citra JPEG(*.jpg)';... '*.*','Semua File(*.*)'},... 'Menyimpan File Citra Hasil Kompresi JPEG');imwrite(handles.data1, fullfile(path_simpan, nama_file_simpan));citra_kompres=imread(fullfile(path_simpan, nama_file_simpan));guidata(hObject,handles);axes(handles.citra2);imshow(citra_kompres);set(handles.text4,'String',nama_file_simpan);set(handles.text12,'String',size(handles.data1,1));set(handles.text13,'String',size(handles.data1,2)); script tersebut menyatakan bahwa terdapat fungsi uigetfile pada function kompres_Callback yang digunakan untuk membuat file citra yang di kompresi akan berformat *.jpg apapun format awal file citra tersebut. Terakhir aadalah mengetikkan script pada bagian function keluar_Callback, script yang diketikkan adalah
selection=questdlg(['Keluar ' get(handles.figure1,'Name')''],... ['Keluar ' get(handles.figure1,'Name')''],... 'Ya','Tidak','Ya');if strcmp(selection,'Tidak') return;enddelete(handles.figure1) Script tersebut berfungsi menampilkankotak dialog yang berisi dua pushbutton yaitu “Ya” dan “Tidak” yang akan menanyakan apakah pengguna ingin keluar dari aplikasi atau tidak. Hasil dari aplikasi ini jika dijalankan adalah sebagai berikut,
Tampilan Awal
Tampilan Pilih Menu Buka Gambar
Tampilan Gambar Asli
Tampilan Pilih Menu Kompres (simpan nama file hasil kompresi)
Tentunya dalam pembuatan program, kita mengenal adanya simbol-simbol perhitungan. Setiap rumus atau ekspresi memakai operator (simbol perhitungan). Pada bahasa pemrograman java, operator dibagi menjadi beberapa jenis, antara lain : operator aritmatika, assignment, increment dan decrement, relasi, dan logika.
1. Operator Aritmatika merupakan operator yang dipakai pada rumus matematika. operator ini terdiri atas +,-,*,/,%(modulus).
2. Operator Assignment merupakan operator pemberi nilai, operator ini menggunakan simbol sama dengan (=).
3. Operator Increment dan Decrement increment merupakan operator yang digunakan untuk menaikkan nilai, sedangkan decrement merupakan operator yang digunakan untuk menurunkan nilai.
4. Operator Relasi merupakan operator yang menghasilkan nilai boolean (true dan false).
5. Operasi Logika merupakan opertor untuk operasi logika, yang sudah tentu menghasilkan nilai boolean.
Materi yang akan dibahas kali ini adalah mengenai PHP & MySQL. Dalam materi PHP & MySQL ini kita akan mempelajari beberapa teknik dalam pengaturan koneksi antara PHP dan database pada MySQL. PHP (Hypertext Preprocessor) adalah bahasa pemrograman berbasis web yang memiliki kemampuan mengolah atau memproses data dinamis. PHP bersifat sever side, artinya sintaks-sintaks dan perintah yang kita berikan akan dijalankan sepenuhnya oleh sever tetapi disertakan dalam halaman HTML biasa. Kali ini kita akan coba membuat database menggunakan Mysql, sebelumnya ada beberapa hal yang perlu kita ketahui, dalam pembuatan database untuk we kita tidak harus selalu membuka aplikasi MySQL terlebih dahulu, namun bisa juga melalui konsole cmd atau jika kita telah meng-install aplikasi XAMPP, maka kita dapat membuatnya pada PHPMyADMIN. Pada percobaan berikut, kita akan mencoba membuat database melalui konsole cmd. Adapun caranya adalah sebagai berikut, pertama kita buka konsole cmd yang ada pada menu window, setelah kita buka kemudian pastkan bahwa posisi kita pada cmd berada pada system c:\xampp\mysql\bin. Jika sudah berada pada system tersebut kita masuk kedalam root MySQL dengan mengetikkan perintah mysql –u root –p.perintah tersebut adalah untuk meminta izin hak akses untuk dapat menggunakan aplikasi MySQL tersebut untuk dapat dijalankan pada konsole cmd. Selanjutnya setelah kita berhasil masuk kedalam root MySQL tersebut maka biasanya kita akan diminta untuk memasukkan password yang ada pada aplikasi tersebut jika kita membuat password tersebut sewaktu kita meng-installnya. Selanjutnya setelah kita sudah dapat masuk kedalam aplikasi ini, kita akan coba membuat database yang diberi nama ”gunadarma”, dengan cara ketikkan perintah berikut create database gunadarma; perintah diatas akan menghasilkan atau membuat nama database kita menjadi bernama ”gunadarma”. Untuk memastikannya bahwa database tadi telah berhasil dibuat maka kita dapat melihat comment dibawah perintah yang telah kita buat tadi, jika berhasil maka commentnya bertuliskan “Query OK, 1 row affected”, sedangkan untuk dapat melihatnya maka kita gunakan perintah untuk menampilkan nama-nama database yang telah dibuat, dengan perintah show databases; kemudian kita juga dapat melihat database apa saja yang telah dibuat termasuk database yang baru dibuat dan diberi nama gunadarma. Setelah kita membuat database maka langkah berikutnya ialah menggunakan databse tersebut untuk proses peng-inputan data, namun sebelum kita dapat gunakan kita harus meminta izin untuk dapat menggunakan database gunadama tersebut dengan perintah use gunadarma; kemudian jika telah ada comment “database change” maka kita baru dapat menggunakan database tersebut untuk proses peng-inputan data. Agar kita dapat memasukkan data-data nantinya, kita membutuhkan table untuk dapat memproses data tersebut, ketikkan perintah seperti dibawah ini create table mahasiswa (NPM varchar(8) primary key, Nama varchar(30), Kelas varchar(5)); dari perintah diatas kita dapat menghasilkan table ang diberi nama table mahasiswa dan elemen-elemen yang dapat ada didalam table tersebut adalah NPM dengan tipe data varchar dan panjang karakter inputannya adalah 8 dan diberikan label sebagai kunci utama atau primary key dari table tersebut, kemudian Nama dengan tipe varchar dan panjang karakter 30 berikutnya yang terakhir adalah kelas dengan tipe data varchar dan panjang karakter 5. Selanjutnya untuk dapat melihat apakah table tersebut telah terbentuk dengan baik ketikkan perintah select * from mahasiswa; Berikutnya kita akan mengisi table mahasiswa tersebut, perintahnya adalah insert into mahasiswa values (‘NPM’,’Nama’,’Kelas’); perintah diatas adalah memberikan inputan pada table mahasiswa untuk tiap elemen-elemen yang ada didalamnya seperti NPM, Nama, dan Kelas. Contoh insert into mahasiswa values (‘50407611’,’Nandhi Angga Eka Putra’,’4IA03’); dapat dijelaskan bahwa elemen NPM diberi inputan 50407611, dan Nama diberi inputan Nandhi Angga Eka Putra, dan yang terkhir elemen Kelas diberi inputan 4IA03. Lanjutkan peng-inputan tersebut hingga ada 10 data. selanjutnya adalah kita akan coba menambahkan nama salah satu komponen data tersebut, perintahnya adalah update mahasiswa set nama=’Cindy Realitha’ where npm=’50407218’; dari perintah diatas dapat dijelaskan bahwa kita akan menambahkan (update) kata ”Realitha” untuk data yang memiliki spesifikasi NPM yang bernomor 50407218. Untuk dapat mengeceknya, kita tampilkan kembali table yang baru di update tersebut Setelah berhasil meng-update data, berarti kita telah menyelesaikan pembuatan data pada database tersebut, langkah berikutnya adalah pembuatan koneksi pada PHP agar database yang tadi telah dibuat dapat terkoneksi dengan baik pada web nantinya. Pada pembuatan awal coding PHP, diawali dengan block scripting $host='localhost'; $user='root'; $pass=''; $connect=mysql_connect($host,$user,$pass); if ($conn){ echo "BERHASIL CONNECT"; } else { echo "GAGAL CONNECT"; } Dapat dijelaskan bahwa kita telah menentukan 4 variabel yang berbentuk string, yaitu host, user , password, dan connect. setelah itu kita buat suatu kondisi menggunkan if else dengan kondisi yang satu dijalankan jika koneksi berhasil maka akan tampil tulisan berhasil connect dan kondisi ke dua dijalankan jika kondisi pertama tidak terpenuhi maka akan tampil pada halaman web nantinya tulisan gagal connect. Untul membuat koneksi dengan database yang telah dibuat tadi maka pada variabel string dimasukkan perintah mysql_connect($host,$user,$pass); maksud dari perintah diatas adalah kitamengaktifkan mysql dari variable-variabel yang ada, yaitu dari localhost kemudian setelah dapat akses menuju ke root dan password yang telah ada pada aplikasi mysql jika ada passwordnya (bersifat opsional), maksudnya adalah jika ada passwordnya maka nantinya didalam tampilan maka akan ada perintah untuk memasukkan passwordnya namun jika tidak ada maka pada variable pass dikosongkan saja. Untuk materi kali ini kita akan membuka koneksi dari database yang telah kita buat, yaitu database “gunadarma”, maka jika dimasukkan pada perintah koneksi diatas menjadi $conn=mysql_connect_select_db('gunadarma') jika telah selesai membuat script PHP untuk koneksi, langkah selanjutnya adalah mencoba menjalankannya menggunakan browser yang kita pilih.
Materi yang akan dibahas kali ini adalah mengenai Java Script. Dalam materi Javascript ini kita akan mempelajari beberapa teknik dalam penggunaan Java Script tersebut dan penggabungan script dari Java Script dengan script HTML.
Java Script adalah suatu bahasa script yang di-interpreter oleh browser ( client side ). Pada awalnya bahasa ini dinamakan “livescript” yang befungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2.
Walaupun penulisan javascript memiliki kemiripan dengan bahasa pemrograman java dan juga C, namun java script tidak sama dengan java, karena :
1. javascript yang dikembangkan oleh Netscape, produknya untuk web disebut web script
2. java yang dikembangkan oleh Sun Microsystem, produknya untuk web adalah applet
Pada pembuatan laporan kali ini kita akan membuat form dan menjalankan function yang terdapat pada javascript. Pembuatan sript dari javascript dideklarasiakan pertama kali menggunakanscript
Script diatas menjelaskan bahwa script atau bahasa yang akan digunakan adalah javascript. Pada javascript script-script yang dibuat sangat sensitive (case sensitive), huruf besar dan huruf kecil sangat berpengaruh untuk setiap perintah dan penamaan variabelnya.
Berikutnya akan masuk pada function. Function merupakan sekumpulan kode-kode javascript yang jika dijalankan akan menghasilkan atau mengerjakan suatu tugas tertentu.
Berikut pendefinisian function
function test () {
var val1=document.kirim.T1.value
if (val1%2==0)
document.kirim.T2.value="bilangan genap"
else
document.kirim.T2.value="bilangan ganjil"
}
Function diatas diberi namafunction test, setiap kali pendeklarasian function diawali tanda () dan { . setelah pembuatan nama function, selanjutnya kita akan mendeklarasikan function tersebut, pada script diatas kita dapat mengetahui bahwa pendeklarasian variabel diberi nama document.kirim. kemudian menggunakan fungsi logika if-else. Maksud dari val1%2 adalah nilai yang berada disebelah kanan operator % ( modulo ) akan di modulokan (dicari sisa baginya ) ke variabel yang berada disebelah kiri dan hasilnya menjadi nilai variabel yang ada disebelah kiri, sementara operator = = (equal) apakah hasil modulo tadi sama dengan nilai yang ada disebelah kanantanda equal.
Dan selanjunya diberikan kondisi dari variabel document.kirim pertama diberi deklarasi variabel bilangan genap dan yang satu lagi bilangan ganjil, jadi kondisi diatas akan dikerjakan atau dipilih salah satunya, jika kondisi pertama terpenuhi maka akan tercetak bahwa bilangan tersebut adalah bilangan genap, namun jika kondisi tersebut tidak terpenuhi maka akan pindah pada kondisi ke dua yaitu akan mencetak bahwa bilangan yang dimaksud adalah bilangan genap. Script diatas akan dijalankan pada form untuk memilih dan menebak bilangan yang dimaksud.
Selanjutnya pada function kedua kita akan membuat pewarnaan, berikut scriptnya
function ubahWarnaLB(warna) {
document.bgColor = warna;
}
function ubahWarnaLD(warna) {
document.fgColor = warna;
}
Dar script diatas dapat dijelaskan bahwa kita menggunakan function untuk dapat mengubah warna dari background dan tulisan.
Pada function yang pertama kita dapat mengetahui maksud dari script document.bgcolor adalah untuk mengubah warna pada bagian background, sementara script document.fgcolor adalah untuk mengubah warna font atau tulisan yang berada pada form tersebut.
Berikutnya kita akan membuat table
Menebak Bilangan
BIL
MERUPAKAN BIL
Script diatas menjelaskan bahwa tebal garis border pada tabel adalah1, sementara untuk tabel menebak bilangan akan terletak di bagian atas, untuk dapat memberikan posisi yang diinginkan, gunakan perintah td valign=top.
Selanjutnya pada form untuk membuat merupakn bilangan yang digunakan untuk dapat menebak bilangan yang telah kita pilih pada bagian menebak bilangan, menggunakan method Post. Pada kolom menebak bilangan dan merupakan bilangan kita menggunakan input type text. Selanjutnya masih pada bagian atas form dan table, kita gunakan input type button untul menu tebak dan input type reset untuk perintah kosongkan.
Fungsi masing-masing inputan adalah, jika kita klik button tebak maka akan keluar jawaban, sementara pada inputan reset, jika kita klik maka form kembali kosong.
Langkah berikutnya kita akan membuat inputan berupa button dari function yang telah kita buat tadi, scriptnya
Untuk membuat button yang kita butuhkan, kita gunakkan input type button, ada 4 buah button yang akan kita buat, yaitu button latar belakang hijau, latar belakang kuning, teks kuning, dan teks biru. Fungsi dari button-button ini adalah, jika pada button latar belakang, setelah kita klik maka warna belakang dari web tersebut akan berubah sesuai dengan yang telah kita pilih, maksud adri perintah onclick adalah button tersebut dapat melakukan perintah yang kita inginkan setelah kita melakukan aksi meng-klik tombol pada mouse kea rah button yang kita ingingkan.
Sementara pada button teks, akan menghasilkan tulisan yang berada pada table berubah sesuai dengan yang kita inginkan .
Dunia Teknologi Informasi tidak hanya berkaitan dengan canggihnya alat-alat komunikasi melainkan juga dengan dunia bisnis dan perdagangan dimana diperlukannya perekayasaan usaha seperti pencatatan hasil transaksi. Proses tersebut membutuhkan ketelitian dan kecepatan waktu pemrosesan. Untuk itu, agar tidak terjadi banyak kesalahan, data-data yang diperlukan dalam transaksi harus dicatat dan diklasifikasikan terlebih dahulu. Hasilnya, data tersebut dapat dijadikan informasi yang dibutuhkan oleh penggunanya. Kondisi tersebut menuntut adanya penyajian data yang menggambarkan keadaan sesungguhnya yang dapat disajikan tepat waktu. Oleh karena itu, sistem informasi sangatlah penting terhadap faktor kesuksesan usaha.
Apabila proses tersebut menggunakan metode tradisional (manual) akan memakan waktu dan biaya yang tidak sedikit. Belum lagi faktor ketelitian manusia yang sangat rentan terhadap proses pencatatan usahanya. Oleh karena itu, perlu adanya pengembangan sistem teknologi modern yang dapat memanfaatkan teknologi komputer yang sudah ada. Teknologi tersebut dapat memproses data menjadi informasi yang dibutuhkan dan dapat dimanfaatkan dengan baik. Perkembangan teknologi tersebutlah yang membuat kami mengubah Aplikasi Penjualan Transaksi menjadi lebih baik dengan memanfaatkan teknologi computer. Aplikasi ini menggunakan bahasa pemrograman Java dan MySQL. Alasannya tidak lain karena kedua bahasa pemrograman tersebut sudah banyak digunakan dan mudah dimengerti.
1.2Tujuan
Aplikasi ini diharapkan dapat dapat membuat data dari usaha dagang menjadi sistematis dan tersturktur. Selain itu, diharapkan pula dapat memberi kemudahan transaksi bagi pelaku usaha dagang pada sektor tersebut.
1.3Ruang Lingkup
Proposal membahas tentang pembuatan aplikasi transaksi penjualan, cara memasukkan atau menambahkan data barang ke dalam database, mengedit, mencari info dari barang serta menghapus data yang sudah ada dengan menggunakan kode barang. Aplikasi ini juga dapat mencetak struk hasil transaksi untuk pembeli dan menghitung sisa stok barang setelah penjualan. Penggunaan aplikasi adalah untuk mempermudah proses transaksi pada usaha dagang.
II. PROJECT
2.1 Job Desk Pembuat
Aplikasi ini dibuat dan dikelola beberapa orang yang terbagi ke dalam beberapa bidang pengerjaan, yaitu
1.Programming: bertugas dalam pembuatan program dan alur aplikasi
2.Database Administrator: bertugas untuk membuat database beserta koneksinya
3.Advertising: bertugas untuk melakukam pemasaran terhadap aplikasi yang dibuat
2.2 Operating System yang Dipakai
Dalam pembuatan aplikasi transaksi ini, perangkat keras (hardware) dan perangkat lunak (software)yang dibutuhkan antara lain yaitu:
Perangkat keras (hardware):
1 unit computer lengkap
Processor Intel(R) Pentium(R) 4 CPU 2.80 GHz
RAM 512 MB DDR1
VGA NVIDIA GeForce 7100 GS 256 MB
Perangkat lunak (software):
Microsoft Windows XP professional (5.1, Build 2600)
JDK 1.60_01
JCreator
MySQL Server versi 5
StarUML
2.3 Anggaran Biaya
Biaya Software dan Hardware
Barang Habis Pakai per Bulan
Biaya Advertising, Pengerjaan, dan Honor Pekerja
III. ALUR PROGRAM
3.1 USe Case Diagram
Gambar di atas memiliki satu actor yaitu user dan sebelas use case yang tergabung dalam sebuah sistem. Antara user dengan sistem digambarkan oleh panah generalization. Sedangkan antara sistem digambarkan dengan hubungan dependency. Dependency yang bersifat include artinya, use case pertama akan menghasilkan kegiatan pada use case selanjutnya. Sedangkan dependency yang bersifat extend, artinya bahwa kegiatan selanjutnya tidak dapat dilakukan tanpa melakukan kegiatan sebelumnya
3.2 Time Table Pengerjaan
Jaminan Kualitas dari Project
Terciptanya aplikasi ini, aplikasi ini dapat digunakan untuk mengatur penyimpanan data barang yang dimiliki. Selain dapat juga memudahkan proses transaksi yang berlangsung dalam toko tersebut. Dengan demikian proses pencatatan manual data serta transaksi pada usaha dagang dapat dipermudah dan dipersingkat melalui aplikasi ini.
Materi yang akan dibahas kali ini adalah mengenai CSS. Dalam materi CSS ini kita akan mempelajari beberapa teknik dalam penggunaan CSS tersebut dan penggabungan script CSS dengan script HTML. CSS adalah singkatan dari Cascading Style Sheet, dapat digunakan untuk menampilkan style dari content dokumen HTML dengan lebih menarik dan meminimalkan penggunaan tag-tag HTML sehingga dapat menghemat waktu pengerjaannya dan lebih cepat proses loadingnya oleh web browser. Cara CSS membuat style dari content adalah dengan menggunakan property dan memberikan nilai yang diinginkan terhadap property tersebut. CSS dapat diimplementasikan dalam 3 cara : 1. Inline style yaitu menjadi atribut dalam tag HTML, atributnya adalah style. Bentuk umumnya adalah : style=”property-1: nilai; property-2: nilai; ……property-n: nilai”
2. Internal style sheet atau embed style yaitu berada didalam tag . Bentuk umumnya adalah : 3. External style sheet yaitu style CSS berada terpisah pada sebuah file .css sedangkan dokumen HTML yang akan menggunakannya / bentuk umumnya adalah :
Kali ini kita akan mencoba membuat 4 buah baris dengan warna yang berbeda, caranya adalah ketikkan :
Script diatas dituliskan pada dokumen HTML, hasilnya akan menjadikan atau membentuk 4 buah garis horizontal. Kemudian kita akan memberikan warna pada masing-masing garis tersebut dengan warna yang berbeda, berikut adalah scriptnya hr.h1 {color:yellow} hr.h2 {color:red} hr.h3 {color:black} hr.h4 {color:purple}
Script diatas dituliskan terlebih dahulu pada dokumen atau file CSS yang terpisah dari dokumen HTML, untuk membuat script css tersebut kita menggunakan cara external style sheet dan selector berupa class. Hasilnya akan terlihat bahwa 4 garis horizontal tersebut akan berwarna kuning, merah, hitam, dan ungu. Selanjunya kita akan coba membuat 4 buah header yang tersusun kebawah dan bertuliskan “4ia03”, caranya adalah ketikkan script berikut pada dokumen HTML
4ia03
4ia03
4ia03
4ia03
Jika telah dibuat, selanjutnya script diatas akan membentuk suatu kata seperti yang kita inginkan tadi. Setelah selesai, selanjutnya kita akan memberikan warna pada tulisan tersebut, warna background dan border style sesuai yang kita ingingkan, ketikkan h1 {color:blue; background-color:yellow; border-style: dotted} h2 {color:yellow; background-color:blue; border-style: dashed} h3 {color:black; background-color:purple; border-style: groove} h4 {color:green; background-color:tan; border-style: dotted} Script diatas, kita buat dalam file css, dari script diatas pula kita dapat menhasilkan a. header1 akan menghasilkan warna tulisan biru, warna background tulisan tersebut kuning dan border style atau kotak yang dipilih adalah type dotted. b. header2 akan menghasilkan warna tulisan kuning, warna background tulisan tersebut biru dan border style atau kotak yang dipilih adalah type dashed. c. header3 akan menghasilkan warna tulisan hitam, warna background tulisan tersebut ungu dan border style atau kotak yang dipilih adalah type groove. d. header4 akan menghasilkan warna tulisan hijau, warna background tulisan tersebut tan dan border style atau kotak yang dipilih adalah type dotted. Berikutnya kita akan membuat 4 buah tulisan dengan menggunkan paragraph, ketikkan
isi tulisan
isi tulisan
isi tulisan
isi tulisan
Peletakkan script diatas adalah pada dokumen HTML dan menggunakan class selector untuk dapat memanggil property yang nantinya akan dibuat pada file css. Hasilnya akan terlihat terdapat 4 buah tulisan dengan masing-masing paragraph yang berbeda. Masih sama dengan header yang diatas, selanjutnya kita juga akan membuat masing-masing tulisan tersebut warna pada tulisan , warna background dan border style. Ketikkan script p.p1 {color:blue; background-color:yellow; border-style: dotted} p.p2 {color:yellow; background-color:blue; border-style: dashed} p.p3 {color:black; background-color:purple; border-style: groove} p.p4 {color:green; background-color:pink; border-style: dotted}
Pembuatan script tersebut dilakukan pada file css, dan akan menghasilkan dari masing-masing tulisan property yang berbeda, seperti warna tulisan yang ada pada setiap tulisan berbeda, seperti contohnya pada paragraph 1 tulisan berwarna biru, background berwarna kuning dan border atau kotak untuk tulisannya bertipe dotted, hal ini tentu tidak akan sama hasilnya dengan paragraph atau tulisan dari paragraph-paragraph berikutnya.
Langkah berikutnya kita akan coba membuat table, ketikkan script
Nandhi
Angga
Eka
Putra
Dari pembuatan script diatas pada dokumen HTML kita akan menghasilkan table yang terdiri dari 2 baris dan 2 kolom, masing-masing baris dan kolom diberikan nama sesuai yang diinginkan. Berikutnya kita akan coba memberikan property yang berbeda pada table tersebut melalui CSS, ketikkan table {background-color: red; color: blue;font-family:comic sans ms}
dari script css diatas kita akan menghasilkan warna background table merah, kemudian warna tulisan biru dan tipe tulisannya adalah comic sans ms Jika script telah selesai kita buat semua, selanjutnya adalah jangan lupa untuk melihat apakah antara dokumen HTML dan file CSS telah terhubung atau belum, Jika belum, kita buat script pada dokumen HTML sebagai berikut
Script diatas dimaksudkan untuk memanggil atau menghubungkan seluruh property yang telah kita buat tadi agar dapat di compile bersama. Dari script diatas kita juga dapat mengetahui bahwa file .css yang dihubungkan dengan dokumen HTML tadi bernama LA3.css Langkah yang paling terakhir adalah jangan lupa untuk menutup semua script yang ada pada dokumen HTML tadi dengan script
Script tersebut dimaksudkan agar script yang tadi telah dibuat dapat dicompile atau dijalankan untuk dapat meilhat hasilnya.