<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="index.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
.hero-image {
background-image: url("image/welcome.jpg");
background-color: #cccccc;
height: 799px;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
position: relative;
}
.hero-text {
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: rgb(19, 17, 17);
}
</style>
</head>
<body>
<div class="hero-image">
<div class="hero-text">
<h1>PRAKTIKUM PEMROGRAMAN WEB</h1>
<h3>Nama : Aini Nurpadilah</h3>
<h3>Nim : 2070231059</h3>
<h3>Class : C1/P2K</h3>
<a href="welcome.html" class="action-btn see" >See More</a>
</div>
background-image: linear-gradient(30deg, #959b9e, #6b6d6e7e);
border-top-right-radius: 90px;
}
}
border-top-left-radius: 22px;
border-bottom-left-radius: 22px;
} body{
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>Menu</title>
<h1 class="menu"><center>SELAMAT DATANG DI MENU TUGAS AKHIR PRAKTIKUM SAYA</center></h1>
<!-- Links in Div -->
<a href="universitas.html">
Universitas
Biodata.html
<!doctype html>
<html>
<head>
<title>biodata</title>
<h1 class="biodata"><center>SELAMAT DATANG DI HALAMAN BIODATA</center></h1>
<link rel="stylesheet" href="biodata.css"/>
</head>
<body>
<form action="#" style="width: 1000px"class="posisi";>
<fieldset class="h"/>
<td><b>Nama Lengkap</b></td>
<td>:</td>
<td>Aini Nurpadilah</td>
</tr>
<tr>
<td><b>Tempat, Tanggal Lahir</b></td>
<td>:</td>
<td>Bekasi, 30 Januari 2001</td>
</tr>
<tr>
<td><b>Umur</b></td>
<td>:</td>
<td>20 Tahun</td>
</tr>
<tr>
<td><b>Jenis Kelamin</b></td>
<td>:</td>
<td>Perempuan</td>
</tr>
<tr>
<td><b>Agama</b></td>
<td>:</td>
<td>Islam</td>
</tr>
<tr>
<td><b>Kewarganegaraan</b></td>
<td>:</td>
<td>Indonesia</td>
</tr>
<tr>
<td><b>Alamat</b></td>
<td>:</td>
<td>Kota Bekasi</td>
</tr>
<tr>
<td><b>No hp</b></td>
<td>:</td>
<td>089698246514</td>
</tr>
<tr>
<td><b>Perguruan Tinggi</b></td>
<td>:</td>
<td>Universitas Krisnadwipayana</td>
</tr>
<tr>
<td><b>Fakultas</b></td>
<td>:</td>
<td>Teknik</td>
</tr>
<tr>
<td><b>Juurusan</b></td>
<td>:</td>
<td>Informatika</td>
</tr>
<tr>
<td><b>Hobi</b></td>
<td>:</td>
<td>rebahan</td>
</tr>
</td>
</tr>
</table>
</fieldset>
</form>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</body>
</html>
Biodata.cs .biodata{
color:white;
background-color: rgba(128, 128, 128, 0.692);
}
table,tr,td{
background-color:rgba(128, 128, 128, 0.192) ; font-family: Verdana;
color:black;
border: 1px solid black;
padding: 5px;
border-collapse: collapse;
}
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
margin-left:40px;
}
Tabel.html
<html>
<head>
<title>tabel</title>
<div class="row">
<h1>TABEL JADWAL KULIAH</h1>
<h1>SEMESTER GANJIL TAHUN AKADEMIK 2020/2021</h1>
<h1>PROGRAM STUDI TEKNIK INFORMATIKA</h1>
<h1>KELAS C2/P2K SABTU</h1>
</div>
<link rel="stylesheet" href="tabel.css"/>
<style type="text/css">
td {
<td>Grafika Komputer</td>
<td>Moch Fachri,ST,MT</td>
<td>O8.00-09.45</td>
</tr>
<tr style="background-color: rgba(243, 11, 23, 0.808);">
<td>2</td>
<td>7</td>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</body>
background-color: rgba(128, 128, 128, 0.692);
}
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
}
Universitas.html
<!DOCTYPE html>
<html>
<head>
<title>Universitas</title>
<h1 class="universitas"><center>SELAMAT DATANG DI HALAMAN UNIVERSITAS</center></h1>
<link rel="stylesheet" href="universitas.css"/>
</head>
<body>
<section>
<a href="https://unkris.ac.id/"><img class="unkris"
src="unkris1.png"></a>
<a href="https://www.harvard.edu/"><img class="harvard"
src="harvard1.png"></a>
<a href="https://www.ox.ac.uk/"><img class="oxford"
src="oxford1.png" ></a>
</section>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</body>
</html>
Universitas.css .universitas{
color:white;
background-color: rgba(128, 128, 128, 0.692);
}
.unkris{
margin-left:100px;
width:225px;
margin-top:150px;
}
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
<title>Kalender</title>
<h1 class="kalender"><center>SELAMAT DATANG DI HALAMAN KALENDER</center></h1>
<link rel="stylesheet" href="kalender.css"/>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> group.v.calendar.google.com&ctz=Asia%2FJakarta"style="border: 1" width="600"
height="600" frameborder="0" scrolling="no"></iframe>
</center>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</div>
background-color: rgba(128, 128, 128, 0.692);
}
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
}
Bank.html
<!DOCTYPE html>
<html>
<head>
<title>bank</title>
<h1 class="bank"><center>SELAMAT DATANG DI HALAMAN BANK</center></h1>
<link rel="stylesheet" href="bank1.css"/>
</head>
<body>
<section>
<ul class="bca">
<a href="https://www.bca.co.id/id/individu"><img class="logobca1"
src=" BCA1.png"></a>
</ul>
<ul class="bni">
<a href="https://www.bni.co.id/id-id/"><img class="logobni2"
src="bni1.png"></a>
</ul>
<a href="welcome.html"><img class="back" src="back1.png"></a>
<ul class="bsi">
<a href="https://www.bankbsi.co.id/"><img class="logobca3"
src="bsi1.png"></a>
background-color: rgba(128, 128, 128, 0.692);
}
margin-right:1000px;
margin-top:90px;
margin-left:50px;
} body{
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
}
Music.html
<!DOCTYPE html>
<html>
<head>
<title>Music</title>
<h1 class="music"><center>SELAMAT DATANG DI HALAMAN MUSIK</center></h1>
<link rel="stylesheet" href="music.css"/>
</head>
<body>
<ul>
<h2 style="color:white;">Beggin-maneskin</h2>
<audio controls>
<source src="beggin.mp3" type="audio/mpeg">
</audio>
</ul>
<ul>
<h2 style="color:white;">Tabu-Brisia Jodie</h2>
<audio controls>
<source src="tabu.mp3" type="audio/mpeg">
</audio>
</ul>
<ul>
<h2 style="color:white;">Easy on me-Adele</h2>
<audio controls>
<source src="easy on me.mp3" type="audio/mpeg">
</audio>
</ul>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</body>
</html>
Music.css .music{
color:white;
background-color: rgba(128, 128, 128, 0.692);
}
background-position: center;
} body{
background-image: url('welcome.jpg');
background-repeat: no-repeat;
<title>media sosial</title>
<h1 class="media_sosial"><center>SELAMAT DATANG DI HALAMAN MEDIA SOSIAL</center></h1>
<link rel="stylesheet" href="media_sosial.css"/>
</head>
<body>
<section>
<a href="https://www.instagram.com/"><img class="instagram"
src="instagram1.png"></a>
<a href="https://www.facebook.com/"><img class="facebook"
src="facebook1.png"></a>
<a href="https://twitter.com/"><img class="twitter"
src="twitter.png"></a>
</section>
<a href="welcome.html"><img class="back" src="back1.png"></a>
</body>
</html>
Media_social.css .media_sosial{
color:white;
background-color: rgba(128, 128, 128, 0.692);
}
.instagram{
margin-left:100px;
width:200px;
background-image: url('welcome.jpg');
background-repeat: no-repeat;
background-size: 100%;
}