TUGAS 1 PWEB - CV

 TUGAS 1 PWEB - CV

Muhammad Raihan Athallah

5025201206

Kelas PWEB B

Tugas 1 mata kuliah Pemrograman Web Kelas B adalah membuat website profile diri menggunakan HTML dan CSS native. Source code dari website ini terletak pada sebuah repository di akun Github saya dan sudah di-deploy menggunakan Github Pages.

screenshoot tampilan:


source code:


index.html

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <title>Raihan's</title>
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    <nav>
      <h2>RAIHAN</h2>
      <ul>
        <li><a href="#">About me</a></li>
        <li><a href="#">Portofolio</a></li>
        <li><a href="#">Contacts</a></li>
      </ul>
    </nav>
    <div class="container">
      <img src="img/foto.png" width="200" alt="" />
    </div>
    <div class="bio">
      <div>
        <h1>Hello Everyone ! I am <span class="name">Raihan</span></h1>
        <p width="100">
          Seorang mahasiswa tahun ketiga dari salah satu Institut terkenal di Surabaya. Sekarang sedang fokus belajar PHP dan ingin mencari pengalaman lebih pada bidang website development. Cita-cita saya ingin menjadi seorang yang
          bermanfaat bagi orang-orang di sekitar.
        </p>
      </div>
    </div>
    <hr />

    <div class="container">
      <div>
        <h2>Biodata</h2>
        <ul>
          <li>Muhammad Raihan Athallah</li>
          <li>Surabaya</li>
          <li>rraihan1947@gmail.com</li>
        </ul>
      </div>
      <div>
        <h2>Skill</h2>
        <ul>
          <li>SQL</li>
          <li>Javascript</li>
          <li>PHP</li>
        </ul>
      </div>
    </div>
    <div class="portof">
      <h2>Portofolio</h2>
      <h3>menyusul</h3>
    </div>
  </body>
</html>


style.css

* {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

ul {
  list-style-type: none;
}
nav {
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 2rem;
  background: #0e465e;
}

nav ul {
  display: flex;
  list-style: none;
}

nav li {
  padding-left: 1rem;
}
body {
  width: 100vw;
  margin: 0;
  padding: 0px;
}

.container {
  display: flex;
  width: 100vw;
}
.container div {
  margin: auto;
  display: flex;
}
.container img {
  margin: 2em auto;
  border-radius: 50%;
}
.bio {
  display: flex;
  width: 100vw;
  flex-direction: column;
  text-align: start;
}
.bio div {
  width: 60vw;
  margin: auto;
}
.name {
  color: rgb(183, 0, 255);
}

hr {
  opacity: 0.5;
}
.portof {
  margin-top: 10em;
  text-align: center;
}





Komentar

Posting Komentar

Postingan populer dari blog ini

TUGAS 4 PWEB - Kode Post Finder

Gambar
  TUGAS 4 PWEB - Kode Post Finder Muhammad Raihan Athallah 5025201206 Kelas PWEB B Pada pertemuan sebelumnya diberikan tugas yaitu membuat pencarian kode pos dengan menggunkan javascript. Pada tugas kali ini saya menggunakan sumber data provinsi, kota, kecamatan, dan kode pos dari file json yang saya dapatkan melalui internet. Saya berhasil membuat pencarian kode pos melalui data yang berada pada file .json hanya saja performa saat tombol cari ditekan masih sangat lama karena banyak sekali data yang didapat apabila input yang dimasukkan terlalu umum. Kodepos Indonesia (raihanathallah.github.io) Berikut adalah hasil screenshoot tampilan website: dan berikut adalah source code-nya: index.html <! DOCTYPE html > < html lang = "en" >   < head >     < meta charset = "UTF-8" />     < meta http-equiv = "X-UA-Compatible" content = "IE=edge" />     < meta name = "viewport" content = "width=device-wid...
Baca selengkapnya

PBKK - KUIS APLIKASI TICKETING

Gambar
  BUS TICKETING Muhammad Raihan Athallah 5025201206 PBKK B Deskripsi Aplikasi Tiket Aplikasi Jual Tiket Bus Online adalah sebuah inovasi yang memudahkan pengguna untuk membeli tiket bus secara praktis dan efisien melalui platform digital. Dengan adanya aplikasi ini, pengguna dapat mengakses berbagai pilihan jadwal, tujuan, dan operator bus dengan mudah hanya dengan beberapa kali sentuhan layar ponsel. Keuntungan utama menggunakan aplikasi Jual Tiket Bus Online adalah kemudahan dan kecepatan dalam melakukan pemesanan tiket. Pengguna tidak perlu lagi antri di loket atau mencari agen perjalanan fisik untuk mendapatkan tiket bus. Cukup dengan beberapa langkah sederhana melalui aplikasi, pengguna dapat melakukan pembayaran menggunakan berbagai metode pembayaran yang aman dan terpercaya. Fungsi dalam Aplikasi Tiket Booking Online Pemesanan tiket bisa dilakukan secara online oleh pengguna. Pengguna dapat melihat jadwal keberangkatan kemudian memilih jadwal dan bus yang diinginkan. Setelah...
Baca selengkapnya

TUGAS 3 PWEB - Sign up & Login Form

Gambar
  TUGAS 3 PWEB - Sign up & Login Form Muhammad Raihan Athallah 5025201206 Kelas PWEB B Pada pertemuan kali ini membahas mengenai javascript dan untuk latihannya diminta membuat sebuah login dan sign up form.\ screenshoot tampilan source code:  login.html <! DOCTYPE html > < head >     < title > Login Form </ title > </ head > < body >     < h3 > LOGIN </ h3 >     < formform="Login_form" onsubmit = " submit_form ()" { " >"}         < h4 > USERNAME </ h4 >         < input type = "text" placeholder = "Enter your email id" />         < h4 > PASSWORD </ h4 >         < input type = "password" placeholder = "Enter your password" />< br >< br >         < input type = "submit" values = "Login" />         < input ...
Baca selengkapnya