Skip to content

Instantly share code, notes, and snippets.

@widiu7omo

widiu7omo/babyshark bootstraped.php

Last active September 25, 2018 06:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save widiu7omo/8ff1cd3a0c987dcdeff576e43a755984 to your computer and use it in GitHub Desktop.
Save widiu7omo/8ff1cd3a0c987dcdeff576e43a755984 to your computer and use it in GitHub Desktop.
Download ZIP
Memperindah tampilan babyshark
Raw
babyshark bootstraped.php
<!doctype html>
<html>
<head>
<title>Baby Shark</title>
<link rel="shortcut icon" href="hiu.png" type="image/x-icon" />
<meta charset="UTF-8">
<!--IE Compatibility modes-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--Mobile first-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap -->
<link rel="stylesheet" href="/css/bootstrap.css">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
<!-- JS -->
<script src="js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
body {
margin: 0;
padding: 0;
text-align: center;
font-family: 'Playfair Display', serif;
}
.bg {
width: 100%;
height: 100%;
position: fixed;
z-index: 1;
float: left;
left: 0;
}
.isi {
width: 80%;
height: auto;
margin: 0 auto;
position: relative;
z-index: 5;
background: transparent;
padding: 20px;
text-align: left;
border: 5px solid black;
}
.font {
font-weight: bold;
color: cyan;
font-size: 20px;
}
</style>
</head>
<body>
<div class="container">
<img src="background.jpg" alt="gambar" class="bg" />
<div class="isi" style="margin-top:15px; margin-bottom:15px;">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 text-center">
<h1><b>LIRIK LAGU BABY SHARK</b></h1>
</div>
</div>
<?php
$lirik = "doo doo, doo doo doo doo";
$lagu = array("Baby Shark","Mummy Shark","Daddy Shark","Grandma Shark","Granpa Shark","Lets go hunt","Run away","Safe at last","It's the end");
for ($i=0; $i <9; $i++)
{
for ($j=0; $j <=5; $j++)
{
if($i == $i && $j<4){
if($i == $i && $j<3){
echo'
<div class="row text-center">
<div class="col-sm-2 col-md-3 col-lg-3">
</div>
<div class="col-sm-8 col-md-6 col-lg-6 font">
'.$lagu[$i].' '.$lirik.' <br>
</div>
<div class="col-sm-2 col-md-3 col-lg-3">
</div>
</div>
';
}
else{
echo'
<div class="row text-center">
<div class="col-sm-2 col-md-3 col-lg-3">
</div>
<div class="col-sm-8 col-md-6 col-lg-6 font">
'.$lagu[$i].' <br><br>
</div>
<div class="col-sm-2 col-md-3 col-lg-3">
</div>
</div>
';
}
}
}
}
?>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment