♠ Posted by Unknown at 21.30
Enkripsi CSS Image Opacity & Bootstrap
Berikut coding untuk membuat gambar dengan opacity dari bootstrap.
<DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Mencoba Bootstrap </title>
<link rel="stylesheet" href="asset/css/bootstrap.css">
<link rel="stylesheet" href="asset/css/bootstrap.min.css">
<link rel="stylesheet" href="asset/css/bootstrap-theme.css">
<link rel="stylesheet" href="asset/css/bootstrap-theme.min.css">
<script src="asset/js/bootstrap.js"></script>
<script src="asset/js/bootstrap.min.js"></script>
<script src="asset/js/jquery.js"></script>
<script src="asset/js/jquery.min.js"></script>
<style>
.jumbotron {
color: #ffffff;
padding: 70px 25px;
background: url(image/coklat.jpeg) repeat;
border: 2px solid black;
}
div.transbox {
margin: 20px;
background-color: #ffffff;
border: 1px solid black;
opacity:0.9=;
filter: alpha(opacity=60);
}
div.transbox h1, p {
margin: 5%;
font-weight: bold;
color: #000000;
}
div.form {
background-color="lightblue";
}
</style>
</head>
<body>
<div class="jumbotron text-center">
<div class="transbox">
<h1><img src="image/lambang.png" alt="lambang" style="float:left;width:20%;height:20%;border:0;">Smk Muhammadiyah 1 Weleri</h1>
<p>Mutu Dalam Prestasi Mulia Dalam Pakarti</p>
<form class="form-inline">
<div class="form">
<input type="email" class="form-control" size="50" placeholder="Email Address" required>
<button type="button" class="btn btn-danger">Send</button>
</div>
</form>
</div>
</div>
</body>
<body>
<!-- ini salah -->
Mencoba bootstrap
</body>
</html>
Maka hasil dari coding diatas adalah sebagai berikut.
0 komentar:
Posting Komentar