Tugas kali ini mengenai halaman berita pada web.
Kodingan news_01.htm:
Kodingan custom.css:
Halaman Index
Halaman Berita
Halaman Berita
Kodingan index.htm:
<!DOCTYPE html>
<html>
<head>
<title>Berita Garing</title>
<link rel="stylesheet" type="text/css" href="custom.css">
</head>
<body>
<div class="menu">
<ul>
<li><a href="index.htm">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div class="header">
<div class="jarak">
<h2>BERITA ASING</h2>
</div>
</div>
<div class="content">
<div class="jarak">
<!-- kiri -->
<div class="kiri">
<!--blog-->
<div class="border">
<div class="jarak">
<table>
<tr>
<td><img src="amazon-ilustrasi.jpg" width="134" height="75">
<td>
<td><a class="header3" href="news_01.htm">Amazon Siap Ekspansi ke Indonesia, Janjikan Investasi hingga Rp14 Triliun</a>
<p>Pihak Amazon bertemu Presiden Jokowi untuk membicarakan rencana ekspasi ke Indonesia...</p>
</tr>
</table>
</div>
</div>
<!--end blog -->
<!--blog-->
<div class="border">
<div class="jarak">
<table>
<tr>
<td><img src="photo2.jpg" width="134" height="75">
<td>
<td><a class="header3" href="">Miliarder Teknologi Asal Jepang Jadi Turis Luar Angkasa Pertama Space X</a>
<p>Inti berita Perusahan milik Elon Musk, Space X, resmi mengumumkan penumpang pertama yang telah ...</p>
</tr>
</table>
</div>
</div>
<!--end blog-->
<!--blog-->
<div class="border">
<div class="jarak">
<table>
<tr>
<td><img src="photo3.jpg" width="134" height="75">
<td>
<td><a class="header3" href="">JD.ID Luncurkan Layanan Belanja Virtual Berbasis Kode QR di Stasiun Kereta</a>
<p>Dengan layanan JD.ID Virtual, masyarakat bisa memilih barang lewat banner yang menyerupai tampilan supermarket di stasiun kereta.</p>
</tr>
</table>
</div>
</div>
<!--end blog-->
</div>
<!--kiri-->
<!--kanan-->
<div class="kanan">
<div class="jarak">
<h3>TAG</h3>
<hr/>
<p><a href="#" class="undecor">Teknologi</a></p>
</div>
</div>
<!--kanan-->
</div>
</div>
<div class="footer">
<div class="jarak">
<p>copyright 2018 Zico Ritonda all reserved</p>
</div>
</div>
</body>
</html>
Kodingan news_01.htm:
<!DOCTYPE html>
<html>
<head>
<title>Berita Garing</title>
<link rel="stylesheet" type="text/css" href="custom.css">
</head>
<body>
<div class="header">
<div class="jarak">
<h2>BERITA ASING</h2>
</div>
</div>
<div class="menu">
<ul>
<li><a href="index.htm">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div class="content">
<div class="jarak">
<!-- kiri -->
<div class="kiri">
<!--blog-->
<div class="jarak">
<h3>Amazon Siap Ekspansi ke Indonesia, Janjikan Investasi hingga Rp14 Triliun</h3>
<p>Sep 21, 2018</p>
<img class="content_img" src="amazon-ilustrasi.jpg">
</div>
<p><h4>Inti Berita</h4>
<ul>
<li>Pada 21 September 2018, Vice President Amazon Werner Vogels bersama Menteri Keuangan Indonesia Sri Mulyani Indrawati bertemu Presiden Indonesia Joko Widodo di Istana Kepresidenan.</li>
<li>Pihak Amazon mengungkapkan rencana mereka untuk melakukan investasi di Indonesia dengan besaran hingga Rp14 triliun dalam jangka waktu sepuluh tahun ke depan.</li>
<li>Langkah awal perusahaan milik Jeff Bezos di Indonesia yaitu dengan menyediakan platform layanan cloud Amazon Web Services (AWS).</li>
<li>Di tanah air, mereka diperkirakan akan mengalami persaingan ketat dengan berbagai perusahaan yang disokong oleh Alibaba, seperti Lazada dan Tokopedia.</li>
</ul>
</p>
<p>
<h4>Fakta penting lainnya</h4>
<ul>
<li>Sebelumnya, pada 17 September 2018, Menteri Keuangan Sri Mulyani Indrawati mengaku tengah berdiskusi dengan Amazon untuk membahas rencana ekspansi perusahaan teknologi tersebut di Indonesia.</li>
<li>Beberapa poin penting yang ditekankan Sri Mulyani dalam pertemuan tersebut berkaitan dengan regulasi investasi dan perpajakan.</li>
<li>Indonesia akan menjadi negara kedua target ekspansi perusahaan Amazon di Asia Tenggara. Sebelumnya, pada November 2017, mereka telah masuk ke pasar Singapura.</li>
<li>Di sisi lain, pesaing mereka, Alibaba telah memasuki pasar Indonesia dengan memberikan suntikan dana pada Tokopedia sebesar US$1,1 miliar (sekitar Rp14 triliun) pada Agustus 2017 serta meresmikan layanan komputasi awan Alibaba Cloud pada Maret 2018.</li>
<li>Selain Alibaba, pemain e-commerce global lainnya yang sedang mencoba masuk ke pasar tanah air adalah Tencent melalui JD.ID dan Shopee.</li>
</ul>
</p>
<p>Sumber: <a href="https://id.techinasia.com/amazon-ekspansi-indonesia">https://id.techinasia.com/amazon-ekspansi-indonesia</a></p>
<!--end blog -->
</div>
<!--kiri-->
<!--kanan-->
<div class="kanan">
<div class="jarak">
<h3>TAG</h3>
<hr/>
<p><a href="#" class="undecor">Teknologi</a></p>
</div>
</div>
<!--kanan-->
</div>
</div>
<div class="footer">
<div class="jarak">
<p>copyright 2018 coadebareng all reserved</p>
</div>
</div>
</body>
</html>
Kodingan custom.css:
body{
background: #fff;
color: #333;
width: 100%;
font-family: sans-serif;
margin: 0 auto;
}
.header{
width: 90%;
margin: auto;
height: 120px;
line-height: 120px;
background: #EA2323;
color: #fff;
}
.content{
width: 90%;
margin: auto;
height: 900px;
padding: 0.1px;
background: #fff;
color: #333;
}
.kiri{
width: 70%;
float: left;
margin: auto;
background: #fff;
height: 420px;
}
.kanan{
width: 30%;
float: left;
margin: auto;
background: #fff;
height: 420px;
}
.border{
border: 2px solid #BF1F1F;
margin-top: 1pc;
margin-bottom: 1pc;
margin-left: 2pc;
margin-right: 2pc;
}
.undecor{
text-decoration: none;
}
.footer{
width: 90%;
margin: auto;
height: 40px;
line-height: 40px;
background: #BF1F1F;
color: #fff;
}
.menu{
background-color: #BF1F1F;
height: 50px;
line-height: 50px;
position: relative;
width: 90%;
margin: 0 auto;
padding: 0;
}
.jarak{
padding: 0 2pc;
}
.menu ul{
list-style: none;
}
.menu ul li a{
float: left;
width: 70px;
display: block;
text-align: center;
color: #fff;
text-decoration: none;
}
.menu ul li a:hover{
background-color: #74C599;
display: block;
}
.content_img{
width: 70%;
height: 70%;
}
Komentar
Posting Komentar