langkah pertama pelajari CSS dan HTML saya akan berbagi ebook HTML CSS download disini.
berikutnya membuat layout pada dasar nya ukuran layar windows rata adalah 1024x768 (recommended)
dan kita akan membuat ukuran modul 15% dan konten 85%
buat lah struktur table seperti berikut
 |
| struktur folder |
1. buatlah file php index.php
<h5 align="center"><a href="includes/dashboard/dashboard.php"> Go to Dashboard</h5>
2. buat footer.php
<script>
window.setTimeout(function() {
$("warning_msg").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 500);
</script>
<div id="footer"> Copyright 2017 - Adynnas | Purchasing Management System
</div>
</body>
</html>
3. buat header.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Muhtadin Purchasing Project</title>
<link rel="stylesheet" href="../../css/style.css" />
<link rel="stylesheet" href="../../css/datatables.min.css" />
<link rel="stylesheet" href="../../css/jquery.dataTables.min.css" />
<script type="text/javascript" src="../../js/datatables.min.js"></script>
<script>
$(document).ready(function() {
$('#example').DataTable();
} );
</script>
</head>
<body bgcolor="#CCCCCC">
<div id="sidebar"><h3> PURCHASE </h3>
<ul>
<li class="<?php if($active == 'dashboard') {echo 'active';}?>"><a href="../dashboard/dashboard.php"> Dashboard </a></li>
<li class="<?php if($active == 'pr') {echo 'active';}?>"><a href="../pr/pr.php"> Purchase Request </a></li>
<li class="<?php if($active == 'po') {echo 'active';}?>"><a href="../po/po.php"> Purchase Order </a></li>
<li class="<?php if($active == 'payment') {echo 'active';}?>"><a href="../payment/payment.php"> Payment Request </a></li>
<li class="<?php if($active == 'report') {echo 'active';}?>"><a href="#"> Report </a></li>
<li class="<?php if($active == 'master') {echo 'active';}?>"><a href="#"> Master </a></li>
</ul>
</div>
<div id="topheader">
<p> Welcome Administrator | <a href="#"> Logout </a> </p>
</div>
4. buat lah file dalam folder dashboard / dashboard.php
<?php
$active = 'dashboard';
include "../header.php";
?>
<div id="konten">
<h5> Dashboard </h5>
<div id="tablebox">
<div class="box4_1">
<p> Jumlah PO </p>
<hr color="#009900"/>
<h1> 120 </h1>
<hr color="#009900"/>
<p><a href="#"> Detail </a></p>
</div>
<div class="box4_2">
<p> Jumlah PO </p>
<hr color="#009900"/>
<h1> 120 </h1>
<hr color="#009900"/>
<p><a href="#"> Detail </a></p>
</div>
<div class="box4_3">
<p> Jumlah PO </p>
<hr color="#009900"/>
<h1> 120 </h1>
<hr color="#009900"/>
<p><a href="#"> Detail </a></p>
</div>
<div class="box4_4">
<p> Jumlah PO </p>
<hr color="#009900"/>
<h1> 120 </h1>
<hr color="#009900"/>
<p><a href="#"> Detail </a></p>
</div>
</div>
</div>
<?php
include "../footer.php";
?>
Sementara begitu dulu teman-teman next saya akan bagikan bagaimana cara membuat CSS dan HTML sederhana . semoga bermanfaat
Tidak ada komentar:
Posting Komentar