Home » All posts

Membuat List Nomer Menggunakan HTML

Membuat nomer atau list bullet menggunakan HTML - Dalam membuat sebuah artikel atau sebuat content lainnya, tidak jarang kita harus memasang suatu komponen agar content tersebut dapat tersusun rapi. Kita bisa saja langsung menginput 1,2,3,4,5 menggunakan keybord, tapi terkadang, hasil yang didapatkan tidak seperti yang diinginkan, terkadang miring kekirikah, miring ke kanankah. Untuk mengatasi masalah tata letak ini, HTML menyediakan dua buah kode yang fungsinya sama dengan numbering atau bulletnya punya microsoft office.

Numbered List

dalam membuat list nomer, kita menggunakan <ol></ol> . setiap content berada dalam <li> </li> .
berikut cara penggunaanya 
Buka Script:

<h3>Numbered List</h3>
<ol>
<li>Nasi Ayam</li>
<li>Nasi Ikan</li>
<li>Nasi Telur</li>
<li>Nasi Spesial</li>
</ol>


Script Lengkap:

<html>
<title>Belajar html</title>
<body>
<h3>Numbered List</h3>
<ol>
<li>Nasi Ayam</li>
<li>Nasi Ikan</li>
<li>Nasi Telur</li>
<li>Nasi Spesial</li>
</ol>


</body>
</html>

Output
list nomer di html

Bullets List

dalam membuat list bullet, kita menggunakan <ul></ul>, sama halnya seperti membuat numbered list, setiap content berada dalam <li> </li>.  
berikut cara penggunaanya

Buka script:

<h3>Bullets List</h3>
<ul>
<li>Teh Anget</li>
<li>Teh Dingin</li>
<li>Jus Jeruk</li>
<li>Kopi</li>
<li>Jus Advokat</li>
</ul>


Script Lengkap:

<html>
<title>Belajar html</title>
<body>
<h3>Bullets List</h3>
<ul>
<li>Teh Anget</li>
<li>Teh Dingin</li>
<li>Jus Jeruk</li>
<li>Kopi</li>
<li>Jus Advokat</li>
</ul>
</body>
</html>
Output
bullet list menggunakan html
semoga bermanfaat

gaga

Program Kasir Sederhana Java

Pada minggu yang cerah ini kita akan mencoba suatu hal yang beda dari biasanya, yang dimana biasanya kita hanya membuat program sekitar 10 - 20 bari, sekarang kita akan membuat program kurang lebih 185 baris. Program kita kali ini adalah program kasir sederhana. Didalam program ini terdapat aritmatika, fungsi do while, dan juga fungsi if. lumayan lengkap juga walaupun kurang sempurna.

Programnya sederhana, tapi agak ribet juga kalau konsep dasarnya belum ada. Semua konsep dasarnya sudah kita jelaskan pada artikel artikel kita sebelumnya, namun jika ada pertanyaan, silahkan tanyakan pada kotak komentar

Program Kasir Sederhana Java

Buka Script:

/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package javaapplication1;

import java.util.Scanner;

/**
*
* @author Gekko
*/
public class Kasir {

public static void main(String [] args){
int NA, NT, NI, JJ, TA, K, JA;
NA = 12000; // nasi ayam
NT = 8000; // nasi telu
NI = 10000; // nasi ikan
JJ = 7000; // jus jeruk
TA = 3000; //teh anget
K = 4000; // kopi
JA = 8000;// jus advokat

int tMakanan1,tMakanan2,tMakanan3,totalMakanan;
int tMinuman1, tMinuman2, tMinuman3, tMinuman4, totalMinuman;
tMakanan1 = 0;
tMakanan2 = 0;
tMakanan3 = 0;
tMinuman1 = 0;
tMinuman2 = 0;
tMinuman3 = 0;
tMinuman4 = 0;
int total,bayar;



int makanan,minuman;


String mulai = "N";
int porsi;

Scanner input = new Scanner(System.in);
do{
do{
System.out.println(" n-- Warung Nasi Padang Kita -- ");
System.out.println("n~Menu Makanan");
System.out.println(" 1. Nasi Padang + Ayam");
System.out.println(" 2. Nasi Padang + Telur");
System.out.println(" 3. Nasi Padang + Ikan");
System.out.print("Pilih Menu Makanan Nomer: ");
makanan = input.nextInt();

if(makanan == 1){
System.out.println("Nasi Padang + Ayam = Rp. " + NA);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMakanan1 = porsi*NA;

System.out.println("Total Makanan = Rp. "+ tMakanan1);



}else if(makanan ==2){
System.out.println("Nasi Padang + Telur = Rp. " + NT);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMakanan2 = porsi*NT;

System.out.println("Total Makanan = Rp. "+ tMakanan2);
}
else if(makanan == 3){
System.out.println("Nasi Padang + Ikan = Rp. " + NI);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMakanan3 = porsi*NI;

System.out.println("Total Makanan = Rp. "+ tMakanan3);
}else{
System.out.println("nnMaaf, nomer pesanan anda tidak ada di menu");

}
}while(makanan >3);
totalMakanan = tMakanan1 + tMakanan2 + tMakanan3;

do{
System.out.println("n~Menu Minuman");
System.out.println("1. Jus Jeruk");
System.out.println("2. Teh Anget");
System.out.println("3. Kopi");
System.out.println("4. Jus advokat");
System.out.print("Pilih menu minuman nomer: ");
minuman = input.nextInt();

if(minuman ==1){
System.out.println("Jus Jeruk = " + JJ);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMinuman1 = porsi*JJ;

System.out.println("Total Minuman = Rp. "+ tMinuman1);
}else if(minuman == 2){
System.out.println("Teh Anget = " + TA);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMinuman2 = porsi*TA;

System.out.println("Total Minuman = Rp. "+ tMinuman2);

}else if(minuman == 3){
System.out.println("Kopi = " + K);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMinuman3 = porsi*K;

System.out.println("Total Minuman = Rp. "+ tMinuman3);




}else if(minuman == 4){
System.out.println("Jus Advokat = " + JA);
System.out.print("Banyak Porsi = ");
porsi = input.nextInt();

tMinuman4 = porsi*JA;

System.out.println("Total Minuman = Rp. "+ tMinuman4);

}else {
System.out.println("nnMaaf, nomer pesanan anda tidak ada di menu");

}
}while(minuman > 4);

totalMinuman = tMinuman1 + tMinuman2 + tMinuman3 + tMinuman4;

total = totalMakanan + totalMinuman;

System.out.print("nTotal = Rp. "+total);


do{
System.out.print("nBayar: ");
bayar = input.nextInt();
if ( bayar < total){

int kurang2 = bayar - total;
System.out.print("Maaf, uang anda tidak cukup Rp. "+ kurang2);


}
}while(bayar <total);



int Kembalian2 = bayar - total;

System.out.print("Kembalian= " + Kembalian2);


System.out.print("n Mulai Lagi ? (y/n)");
mulai = input.next();

}while(mulai.equals("y"));
System.out.println("nTerima Kasih");
}

}


Output Program
program kasir java sederhana

gaga

Program Memunculkan Bilangan Prima PHP

Ini adalah ketiga kalinya saya katakan bahwa bilangan prima adalah bilangan yang habis dibagi dengan 1 dan bilangan itu sendiri. untuk mendapatkan tujuan itu, kita disini menggunakan perulangan for, yang dimana nantinya program akan mengulang proses untuk mendapatkan bilangan prima dengan cara menyeleksinya satu persatu. tanpa basa basi lagi, silahlah lihat scriptnya

#Tampilan

header.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Belajar Php</title>
<link rel="stylesheet" type="text/css" href="style.css" /> <!Memanggil style css>
</head>
<body>
<div id="sampul"> <!div id= membuat class css dengan nama header>


<div id="header">
<center><h2>Belajar PHP</h2></center>
<div id="linkHeader">
<h4><a href="index.php">Beranda</a></h4>
</div>
</div>
<div id="body">
<div id="SidebarKiri">

</div>
<div id="isi">

</body>
</html>


footer.html:

<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
<body>
</div>
<div id="SidebarKanan">

</div>
</div>
<div id="footer">
<h2>Java Kita</h2>
</div>

</div>
</body>
</html>


style.css:

/*
Document : style
Created on : Sep 13, 2013, 3:27:50 PM
Author : Razaq
Description:
Purpose of the stylesheet follows.
*/

body{
background-color: #999999;
margin: 0px;
padding: 0px;
}

#sampul{ /*membuat class sampul di css */
margin: auto;
width: 900px;
clear: both; /*berhubungan dengan posisi text pada isi nanti */
text-align: center;
/*kita gunakan sampul supaya semuanya otomatis di tengah*/
}

#header{
height: 197px;
background-color: #0066ff;
padding: 20px;
text-align: left;
}

#linkHeader{
margin-top: 140px;
margin-left: 0;
text-align: left;

}

#body{
background-color: #cc0099;
clear: both;
display: table-row;

}

#SidebarKiri{
float: left;
width: 200px;
margin:0;
padding:10px;
border: 0;
clear: both;
background-color: #cc0099;
}
#isi{
float: left;
width: 440px;
margin:0;
padding:10px;
border: 0;
background-color: #cc00cc;
text-align: justify;
}
#SidebarKanan{
float: right;
width: 200px;
margin:0;
padding:10px;
border: 0;
background-color: #cc0099;
}

#footer{
height: 120px;
border: 0;
clear:both;
background-color: #9900cc;
padding: 20px;

}

#Program

Buka Script:

<?php
include 'header.html';
?>
<center><h2>Program Memunculkan Bilangan Prima PHP</h2></center>
<form method="POST">
<table border="0">
<tr>
<td>Masukkan Batas: </td>
<td><input type="text" name="batas" size="15" /></td>
</tr>
<tr>
<td>
<input type="submit" name="proses" value="Proses" />

</td>
</tr>
</table>

</form>

<?php
if($_POST['proses']){
$batas = isset($_POST['batas'])? $_POST['batas']:NULL;

for($a=1;$a<=$batas;$a++){
$i=0;
for($b=1;$b<=$batas;$b++){
if($a % $b == 0){
$i++;
}
}

if($i==2){
echo $a;
echo "<br/>" ;
}
}

}
?>
<?php
include 'footer.html';
?>

output
output program memunculkan bilangan prima php

 untuk Penjelasan program, bisa lihat di halaman C++ ini, penjelasannya sama saja.

semoga bermanfaat

gaga

Program Memunculkan Bilangan Prima C++

Seperti yang kita ketahui, bilangan prima adalah bilangan yang habis dibagi dengan satu dan bilangan itu sendiri. contohnya ada 2, 3, 5, 7, 11, 13 dst. Dalam menentukan bilangan prima, kita masih menggunakan fungsi for, fungsi perulangan for. Disini, kita akan melakukan perulangan untuk mencocokan nilai yang dimasukkan dengan nilai penyeleksi sehingga yang tersisa hanyalah bilangan prima itu sendiri .. 

ngerti, ? kalau belum ngerti lihat dulu scriptnya, akan saya jelaskan dibawah

#include <iostream.h>
#include <conio.h>
void main(){
clrscr();
int batas;
cout<<"Program Memunculkan Bilangan Prima sampai Batas tertentu";
cout<<"\nMasukkan batas: ";
cin>>batas;
for(int a=1;a<=batas;a++){ // for pertama
int i=0;
for(int b=1;b<=batas;b++){ // for kedua
if(a%b == 0){ // if pertama
i++;
}
}
if(i==2){ // if kedua
cout<<a;
cout<<"\n"  ;
 }
}
}

Penjelasan 

~ for pertama berfungsi untuk memberikan nilai awal
~ for kedua berfungsi untuk memberikan nilai penyeleksi
~ if pertama bertugas untuk menyeleksi apakah antara nilai awal dan nilai penyeleksi sama, jika sama maka i++;
~ if kedua bertugas untuk memunculkan hasil seleksi pada if pertama

output
output Program Memunculkan Bilangan Prima C++

gaga

Program Memunculkan Bilangan Prima Java

Bilangan prima adalah bilangan yang habis dibagi dengan satu dan dengan bilangan itu sendiri. Pada kesempatan kali ini, kita akan membuat program untuk memunculkan bilangan prima menggunakan java dengan fungsi for. yang kita lakukan adalah mengulang program hingga ia mendapatkan angka yang sama dengan dirinya sendiri dan memunculkannya, cukup simple kan. ?

#Program Bilangan Prima Java

import java.util.Scanner;
/**
 *
 * @author Razaq Nice
 */
public class prima {
   
    public static void main(String [] args){
        Scanner input = new Scanner(System.in);
       
        System.out.print("masukkan batas: ");
        int batas = input.nextInt();
    int j,k;
    for( k=1; k<=batas;k++){ // for pertama
        int i=0;
        for( j=1; j<=batas;j++){ // for kedua
           
            if(k % j == 0){ // if pertama
                i++;
            }
        }
        if( i==2){ // if kedua
            System.out.println(k);
        }
    }
    }
   
   
}


Perjelasan 

~ for yang pertama berfungsi untuk memberikan nilai, for yang kedua berfungsi untuk menyeleksi nilai, menyeleksi angka, apakah angka yang diberikan jika dibagikan dengan angka penyeleksi memberikan sisa bagi 0? jika ia i++; menambah i.

~di if yang kedua dilakukan seleksi nilai yang telah diseleksi, yang tidak dapat saya jelaskan adalah mengapa i == 2 akan memunculkan bilangan prima, dan kenapa jika i != 2 akan memunculkan selain bilangan prima. 

Output: 
output program bilangan prima di java

gaga

Program Genap Ganjil dengan Fungsi For PHP

Pada kesempatan kali ini kita akan membuat program genap ganjil dibantu oleh perulangan for. For disini tugasnya hanya untuk mengulang saja output dari program. output dari batas. dan proses penyeleksian angka tersebut genap atau ganjil dilakukan oleh fungsi IF

Kita masih menggunakan template yang lama, kalau tidak paham tentang penggunaan template silahkan baca dulu artikel ini

Berikut Scriptnya

#Tampilan

header.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Belajar Php</title>
<link rel="stylesheet" type="text/css" href="style.css" /> <!Memanggil style css>
</head>
<body>
<div id="sampul"> <!div id= membuat class css dengan nama header>


<div id="header">
<center><h2>Belajar PHP</h2></center>
<div id="linkHeader">
<h4><a href="index.php">Beranda</a></h4>
</div>
</div>
<div id="body">
<div id="SidebarKiri">

</div>
<div id="isi">

</body>
</html>


footer.html:

<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
<body>
</div>
<div id="SidebarKanan">

</div>
</div>
<div id="footer">
<h2>Java Kita</h2>
</div>

</div>
</body>
</html>


style.css:

/*
Document : style
Created on : Sep 13, 2013, 3:27:50 PM
Author : Razaq
Description:
Purpose of the stylesheet follows.
*/

body{
background-color: #999999;
margin: 0px;
padding: 0px;
}

#sampul{ /*membuat class sampul di css */
margin: auto;
width: 900px;
clear: both; /*berhubungan dengan posisi text pada isi nanti */
text-align: center;
/*kita gunakan sampul supaya semuanya otomatis di tengah*/
}

#header{
height: 197px;
background-color: #0066ff;
padding: 20px;
text-align: left;
}

#linkHeader{
margin-top: 140px;
margin-left: 0;
text-align: left;

}

#body{
background-color: #cc0099;
clear: both;
display: table-row;

}

#SidebarKiri{
float: left;
width: 200px;
margin:0;
padding:10px;
border: 0;
clear: both;
background-color: #cc0099;
}
#isi{
float: left;
width: 440px;
margin:0;
padding:10px;
border: 0;
background-color: #cc00cc;
text-align: justify;
}
#SidebarKanan{
float: right;
width: 200px;
margin:0;
padding:10px;
border: 0;
background-color: #cc0099;
}

#footer{
height: 120px;
border: 0;
clear:both;
background-color: #9900cc;
padding: 20px;

}

#Program Utama

Buka Script:

<?php
include 'header.html';
?>
<center><h2>Program Genap Ganjil dengan For</h2></center>
<form method="POST">
<table border="0">
<tr>
<td>Masukkan Angka Batas: </td>
<td><input type="text" size="15" name="batas" /></td>
</tr>
<tr>
<td><input type="submit" name="proses" value="Proses" /></td>
</tr>
</table>
</form>

<?php
$batas= isset($_POST['batas'])? $_POST['batas']:NULL;

for($i =1 ; $i<$batas ;$i++){
if($i % 2 == 0){
echo $i;
echo ' Anda memasukkan Angka Genap ';
echo '<br/>';
}else{
echo $i;
echo ' Anda memasukkan Angka Ganjil';
echo '<br/>';
}
}


?>


<?php
include 'footer.html';
?>

Output
Program genap ganjil menggunakan fungsi for php

Programnya bebas di ubah ubah, apakah menjadi hanya memunculkan genap saja, atau ganjil saja, tinggal ubah di bagian proses pada fungsi IF nya ..

semoga bermanfaat

gaga

Program Memunculkan Genap Ganjil For C++

Pada kesempatan kali ini kita akan membuat program untuk memunculkan angka genap ganjil menggunakan perulangan for. Atau, kita bisa juga memfilternya dengan memunculkan angka genap saja atau angka ganjil saja. Pada artikel sebelumnya kita sudah membahas bagaimana cara membuat program genap ganjil sederhana. Kemudian kita sudah berhasil mengembangkannya dengan memasukkan fungsi while do. Sekarang kita akan kembangkan lagi menggunakan fungsi For.

Inti dari program kali ini ialah mengular proses mod (sisa bagi) di dalam programnya for, sehingga dapat memunculkan genap atau ganjil tersebut.

#Script Memunculkan Angka Genap Ganjil

#include <iostream.h>
#include <conio.h>
void main() {
int batas;
cout <<"Masukkan Angka Batas: ";
cin >>batas;
for(int i=1; i<batas;i++){
if(i%2==0){
cout<<i <<" Adalah angka Genap \n" ;
}else{
cout<<i <<" Adalah angka ganjil \n";
}
}
}
Output 
genap ganjil c++

#Script Memunculkan Angka Genap atau Ganjil Saja (filter)

#include <iostream.h>
#include <conio.h>
void main() {
int batas;
cout <<"Masukkan Angka Batas: ";
cin >>batas;
for(int i=1; i<batas;i++){
if(i%2==0){ //ubah 0 menjadi 1 unutk memunculkan angka ganjil
cout<<i <<" Adalah angka Genap \n" ;   //kalau yang di atas uda di ubah, jangan lupa untuk mengubah yang ini
}
}
}
Output
memunculkan angka genap saja c++

Sekian, Semoga bermanfaat

gaga

Subscribe to: Posts (Atom)