Rabu, 02 Desember 2020

TUGAS MANDIRI CARA MEMBUAT WEBSITE MENGGUNAKAN HTML DAN CSS

 NAMA : RATNA WULANDARI 

KELAS : XII RPL-2 


Assalamualaikum teman teman pada pertemuan kali ini tema nya adalah project daftar riwayat hidup, Dengan menggunakan html dan css. Berikut ini adalah  CODING nya :

1. CODING 

<!DOCTYPE html>
<html>
<head>
<title>DAFTAR RIWAYAT HIDUP</title>
<style>
*
{
margin: 0;
padding: 0;
}
nav {
margin:auto;
text-align: center;
width: 100%;
font-family: arial;
}

nav ul {
background: red;
padding: 0 20px;
list-style: none;
position: relative;
display: inline-table;
width: 100%;
}

nav ul li{
float:left;
}

nav ul li:hover{
background:#66CC33;
}

nav ul li:hover a{
color:#000;
}

nav ul li a{
display: block;
padding: 25px;
color: #fff;
text-decoration: none;
}
</style>

</head>
<body bgcolor="FFb3b3">
<nav>
<ul>
<li><a href="https://www.facebook.com/profile.php?id=100029821478853":>💜Facebook🌸</a></li>
<li><a href="https://r4tn4wdari.blogspot.com/2020/09/tugas-praktek-daring-pbo.html">💜Blog🌸</a></li>
</ul>
</head>
<h1 align="center">DAFTAR RIWAYAT HIDUP</h1>
<h1><marquee behavior="alternate" direction="">WELCOMETO MY WEBSITE</marquee></h1>
<table width="745" border="1" cellspacing="0" cellpadding="5" align="center">
<tr align="center" bgcolor="#ff4000">
<td width="174">BIODATA DIRI</td>
<td width="353">KETERANGAN</td>
<td width="232">FOTO</td>
</tr>
<tr>
<td>NAMA</td>
<td>RATNA WULANDARI</td>
<td rowspan="10" align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmNKAHgzKoZ0oufzWb8O_lFCS8N3JSQXkxKBqeG094ovRzaM3MbsrXpz6IHhIfqMnmkYiM58FSk8AZ9DTtAtsau_I4go78DmQcV1IC6CBlwlX8nZskMdRBjBN2qXZVATLyOk_fHVh_t6o/s1600/20200508_122110.jpg" style="widht:200px; height:180px;"></td>
</tr>
<tr>
<td>TEMPAT/TGL LAHIR</td>
<td>BANDUNG 13 JUNI 2001</td>
</tr>
<tr>
<td>JENIS KELAMIN</td>
<td>PEREMPUAN</td>
</tr>
<tr>
<td>ALAMAT</td>
<td>KP.CIDADAP RT03/RW12</td>
</tr>
<tr>
<td>AGAMA</td>
<td>ISLAM</td>
</tr>
<tr>
<td>KEWARGANEGARAAN</td>
<td>INDONESIA</td>
</tr>
<tr>
<td>SEKOLAH</td>
<td>SMK 4 LPPM RI PADALARANG</td>
</tr>
<tr>
<td>JURUSAN</td>
<td>REKAYASA PERANGKAT LUNAK</td>
</tr>
<tr>
<td>HOBY </td>
<td>MEMBACA</td>
<tr>
</table>
</body>
</html>

3. TAMPILAN CODING 










3. HASIL TAMPILAN 



Demi kian pembelajaran hari ini, Mohon maaf apa bila ada yang salah dalam coding diatas






























Kamis, 10 September 2020

Tugas Mandiri Cara Membuat Website Menggunakan HTML Dan CSS

 NAMA : RATNA WULANDARI 

KELAS : XII RPL-2 


Assalamualaikum teman teman pada pertemuan kali ini tema nya adalah project daftar riwayat hidup, Dengan menggunakan html dan css. Berikut ini adalah  CODING nya :

1. CODING 

<!DOCTYPE html>

<html>

<head>

<title>DAFTAR RIWAYAT HIDUP</title>

<style>

*

{

    margin: 0;

    padding: 0;

}

    nav {

        margin:auto;

        text-align: center;

        width: 100%;

        font-family: arial;

    } 


    nav ul {

        background: red;

        padding: 0 20px;

        list-style: none;

        position: relative;

        display: inline-table;

        width: 100%;

     }


    nav ul li{

        float:left;

    }


    nav ul li:hover{

        background:#66CC33;

    }


    nav ul li:hover a{

        color:#000;

    }


   nav ul li a{

        display: block;

        padding: 25px;

        color: #fff;

        text-decoration: none;

    }

    </style>   


    </head>

<body bgcolor="FFb3b3">

<nav>

    <ul>

        <li><a href="https://www.facebook.com/profile.php?id=100029821478853":>Facebook</a></li>

        <li><a href="https://r4tn4wdari.blogspot.com/2020/09/tugas-praktek-daring-pbo.html">Blog</a></li>

    </ul>

</head>

<h1 align="center">DAFTAR RIWAYAT HIDUP</h1>

<h1><marquee behavior="alternate" direction="">Selamat Datang Di Halaman Biodata Ratna Wulandari</marquee></h1>

<table width="745" border="1" cellspacing="0" cellpadding="5" align="center">

<tr align="center" bgcolor="#ff4000">

<td width="174">BIODATA DIRI</td>

<td width="353">KETERANGAN</td>

<td width="232">FOTO</td>

</tr>

<tr>

<td>NAMA</td>

<td>RATNA WULANDARI</td>

<td rowspan="10" align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmNKAHgzKoZ0oufzWb8O_lFCS8N3JSQXkxKBqeG094ovRzaM3MbsrXpz6IHhIfqMnmkYiM58FSk8AZ9DTtAtsau_I4go78DmQcV1IC6CBlwlX8nZskMdRBjBN2qXZVATLyOk_fHVh_t6o/s1600/20200508_122110.jpg" style="widht:200px; height:180px;"></td>

</tr>

<tr>

<td>TEMPAT/TGL LAHIR</td>

<td>BANDUNG 13 JUNI 2001</td>

</tr>

<tr>

<td>JENIS KELAMIN</td>

<td>PEREMPUAN</td>

</tr>

<tr>

<td>ALAMAT</td>

<td>KP.CIDADAP RT03/RW12</td>

</tr>

<tr>

<td>AGAMA</td>

<td>ISLAM</td>

</tr>

<tr>

<td>KEWARGANEGARAAN</td>

<td>INDONESIA</td>

</tr>

<tr>

<td>SEKOLAH</td>

<td>SMK 4 LPPM RI PADALARANG</td>

</tr>

<tr>

<td>JURUSAN</td>

<td>REKAYASA PERANGKAT LUNAK</td>

</tr>

<tr>

<td>HOBY </td>

<td>MEMBACA</td>

<tr>

</table>

</body>

</html>


2. TAMPILAN CODING 








Maka setelah coding selesai tampilan akan berubah seperti di bawah ini.


3. HASIL TAMPILAN CODING                                      
 


Demi kian pembelajaran hari ini, Mohon maaf apa bila ada yang salah dalam coding diatas






Kamis, 03 September 2020

TUGAS PRAKTEK DARING PBO

 NAMA : RATNA WULANDARI 

KELAS : XII RPL-2 


Pada kesempatan kali ini saya mempelajari html dan css. 

1. CODING 

  <!DOCTYPE html>

<html>


<head>

<title>belajar html dan css</title>


<style>


h1 {

        /* Memberikan warna Tulisan pada Tag/element H1 */

        color : #ff4000;

        /* Memberikan ukuran huruf pada Tag/eleent H1 */

        font-size :50px;

        /* Memberikan Background Tulisan pada Tag/element H1 */

        background-color : #40ff00;

}


p {

     /* Memberikan Jenis huruf pada Tag/element p */

     font-family : georgia;

     /* Memberikan Background Tulisan pada Tag/element p */

      background-color : #00ffff;


}


h2 {

       width : 500px;

       higth  : 80px;

       background-color : #ff00ff;

}


img {

         width : 500px;

         higth  : 80px;

                }

ul {

      color : #ff0000;

}


.seleksi1 {

color : red;

}


.seleksi2 {

color : blue;

}


.seleksi3 {

color : green;

}


</style>


</head>

<body>


<h1>BELAJAR MEMBUAT HALAMAN WEB DENGAN BAHASA HTML DAN CSS</h1>

<p>Ini adalah halaman pertama kami membangun Halaman Website dengan HTML dan CSS</p>


<h2>COVID 19 SEMOGA BERAKHIR </h2>

<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT8ICbzCAQH3WMgx3Vv8btRDQVlIG_19qyOrg&usqp=CAU" />



<p>Belajar Menjadi Programmer</p>

<ul>

<li class="seleksi1"> PHP </li>

    <li class="seleksi2"> HTML </li>

    <li class="seleksi3"> JAVA </li>

</ul>

</body>

</html>


2. Tampilan CODING





3. Hasil Tampilan Dari CODING 


 


SEKIAN PEMBELAJARAN KALI INI MOHON MAAF APABILA ADA KESALAHAN.











Senin, 03 Agustus 2020

TUGAS 1 HTML LANJUTAN -XII RPL TH 2020

Nama : Ratna Wulandari 
Kelas  : XII RPL-2

 
1. CODING

<html>
<head>
<title>todo suply a title</title>
<head>
<body>
<a href="">Prograte</>
<h1>HALLO WORD!</h1>
<h2>Ayo Belajar Coding</h2>
<h3>Pelajaran</h3>
<ul>
            <li>HTML</li>
            <li>PHP</li>
            <li>RUBY</li>
</ul>
</body>
</html>

2. GAMBAR TAMPILAN CODING 



3. GAMBAR HASIL TAMPILAN 










TUGAS 1 HTML LANJUTAN - XII QUIZ 2RPL-TH2020

TUGAS 1 HTML LANJUTAN - XII QUIZ 2RPM2RPL TH 2020


MENCARI SINTAK ELOR
 
1.kurang tag penutup untuk </head>
2.Kesalahan tag penutup </H3> seharusnya </h2>
3.kurang tanda / pada tag penutup <p>  paragraf ke2 seharusnya </p> dan juga pada akhir <html> seharusnya </html>
4.tag </> tidak berfungsi


PENULISAN CODING YANG SALAH :
<html>
<head>
<title>
Quiz 1
</title>
<body>
<p> belajar menjadi ahli butuh latihan yang terus menerus </p>
<h3> Menemukan sintak yang salah dan kurang<h2>
<p> Latihan skill dengan mengulang-gulang materi agar otak dan tangan menjadi terlatih<p>
<p>
</>
<html>

PENULISAN CODING YANG BENAR ADALAH SEBAGAI BERIKUT :
<html>
<head>
<title>QUIZ 1</title>
</head>
<body>
<H3>menemukan sintak yang salah dan kurang</H3>
<p>belajar menjadi ahli butuh latihan terus menerus</p>
<p>latihan skill dengan terus mengulang-ngulang materi agar otak dan tangan menjadi terlatih</p>
</body>
</html>

Senin, 11 Mei 2020



Tugas DARING MATERI 3 BELAJAR HTML- HTML Tag, Element, Attribute,& comments 

STUDI KASUS : Membuat Halaman Website sederhana menggunakan Text Editor W3Schools / Text Editor apapun yang kalian
miliki dengan rincian hasil akhir yang harus di capai sebagai berikut:
1. Website Harus mengandung data Profile Kalian
• BIODATA (Nama Lengkap , Tempat & Tgl Lahir , Jenis Kelamin , Kelas , Alamat , No WA , Email
• FOTO PRIBADI
2. Website harus mengandung Cerita Unik Selama STAY AT HOME dimasa Pandemi Covid19
3. Website harus mengandung Text Yang jika di KLIK akan mengarah ke Halaman BLOG Kalian Masing2. ( Hyperlink )
4. Website harus mengandung Comment dan Atribute
Untuk lebih Jelasknya bisa dilihat Tampilan Website Berikut ini :

#Coding

<html>
<head>
<title>Website Pribadiku</title>
</head>
<body>
<body bgcolor="red">
<center>
<header><h2>WELCOME TO MY WEBSITE</h2>
</header>
<!.. Paragraf ini tentang pengalamanku
selama STAY AT HOME ..>
<main>
<a href=https://a-pelajarperdulicovid-19.blogspot.com/2020/03/pelajar-perduli-covid-19.html?m=1" >
Kunjungi BLOGKu</a>
<hr></hr>
<img src="/ Ratna Wulandari .jpg" alt="Image"
style="width:100px;height:100px;">
<h3>RATNA WULANDARI </h3>
<strong>My Biografi</strong>
<br>Bandung, 13 juni 2001</br>
<br>Perempuan</br>
Kp.cidadap rt03/rw12 Des.Padalarang 
Ke.Padalarang Kab.Bandung 
<br><strong>Contact:</strong></br>
0895328718996
- ratnawd329@gmail.com 
<p>Pengalaman saya selama Stay at home 
</p>
</main>
</center>
<hr></hr>
</body>
</html>

#tampilan coding 

#Hasil tampilan 

#foto siswa yang sedang mengerjakan 



Kamis, 07 Mei 2020

TUGAS DARING MATERI 2 BELAJAR HTML- HTML Tag, Element, Attribute & Comment

MENAMPILKAN GAMBAR DAN SEJARAH SMK 4 LPPM RI PADALARANG MENGGUNAKAN HTML 


 *CODING

<DOCTYPE html>
<html>
<head>
<title>miftah fariz</title>
</head>
<body>

<p style="color:blue">smk 4 lppm ri</p>
<img src="https://scontent.fbdo1-1.fna.fbcdn.net/v/t1.0-
9/95607295_110713980626889_160179272000995328_n.jpg?_nc_cat=106&_nc_sid=85a577&_nc_eui2=AeFsKNuhxi4jQS6pKr3
V7ocqLUz1D8FhEoQtTPUPwWEShKYDajKIeIuc6deOJhoRi1E&_nc_ohc=lwUGa3382soAX-kY3At&_nc_ht=scontent.fbdo1-
1.fna&oh=dfed21c791c0b0c580e50ec60d16588b&oe=5EDA9E12" alt="smk">

<p>Sekolah Menengah Kejuruan SMK 4 LPPM RI PADALARANG didirikan pada tahun 2008 dan baru
mendapatkan ijin pendirian pada tahun 2011 di bawah naungan Yayasan Lembaga Pendidikan
dan Pengetahuan Masyarakat Republik Indonesia. Pada Tahun 2008 SMK 4 LPPM RI
PADALARANG dipimpin oleh seorang Kepala Sekolah yang bernama Visa Irany Thresna Dewi,
S.Pd. MM, pada awal pendirian 4 LPPM RI PADALARANG membuka 2 Dua kompetensi Keahlian
yaitu Rekayasa Perangkat Lunak dan Akomodasi Perhotelan dan pada tahun 2011 baru membuka
kembali 2 Dua kompetensai keahlian yaitu Teknik Komputer Jaringan dan Teknik Sepeda Motor
Pada Tahun Ajaran 20132014 SMK 4 LPPM RI PADALARANG memiliki siswa sebanyak 705
siswa.
</body>
</html>

Hasilnya akan menjadi seperti ini  :


TUGAS MANDIRI CARA MEMBUAT WEBSITE MENGGUNAKAN HTML DAN CSS

  NAMA : RATNA WULANDARI  KELAS : XII RPL-2  Assalamualaikum teman teman pada pertemuan kali ini tema nya adalah project daftar riwayat hidu...