MENGENAL HTML DAN CARA MENGEDIT STLE

MENGEDIT STYLE MENGGUNAKAN HTML

halo semuanya kali ini saya akan memberi info baru lagi nih,untuk kali ini saya akan memberi info tentang HTML…

PENGERTIAN HTML
  Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML.



Sekarang saya akan memberikan informasi mengedit stlye atau gaya menggunakan html…….

Tag HTML Style

Maksud style disini adalah memberikan sentuhan artistik yang akan ditampilkan pada dokument HTML seperti memberikan warna font, mengubah ukuran font yang akan digunakan, memberikan warna background pada halaman HTML dan banyak lain nya, untuk memberikan style pada tag html bisa menggunakan format seperti ini

<tagname style="property:value;"></tagname>

untuk melakukan praktek pada sesi ini silahkan buat sebuah file baru dengan nama latihan4.html dan lakukan praktek pada script dibawah ini, untuk latihan pertama misalnya kita ingin memberikan warna pada font yang ada pada sebuah paragraf maka scriptnya :

<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>

untuk memberikan jenis font yang akan digunakan bisa menggunakan script :
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>

untuk memberikan ukuran pada font yang akan ditampilkan bisa menggunakan script :
<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>

untuk memberikan jenis perataan pada sebuah text yang akan ditampilkan bisa menggunakan script :
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>


atau kalian bisa juga melakukan menggunakan cara seperti yang di bawah ini

Edit langsung nama dan nilai properti gaya di panel Styles. Semua gaya bisa diedit, kecuali yang diwarnai abu-abu (seperti halnya stylesheet agen-pengguna).

Untuk mengedit nama atau nilai, klik nama atau nilai tersebut, lakukan perubahan, dan tekan Tab atau Enter untuk menyimpan perubahan itu.

Secara default, perubahan CSS Anda tidak permanen, perubahan akan hilang saat Anda memuat ulang laman. Siapkan penulisan persisten jika Anda ingin mempertahankan perubahan Anda antar pemuatan laman.




Memeriksa dan mengedit parameter model kotak

Periksa dan edit parameter model kotak untuk elemen saat ini menggunakan panel Computed. Semua nilai di model kotak bisa diedit, cukup klik nilai tersebut.


Kotak konsentris berisi nilai top, bottom, left, right untuk properti padding, border, dan margin elemen saat ini.

Untuk elemen yang posisinya tidak statis, kotak position juga ditampilkan, yang berisi nilai properti top, right, bottom, dan left.

Untuk elemen position: fixed dan position: absolute, bidang tengah berisi dimensi piksel offsetWidth × offsetHeight sebenarnya dari elemen yang dipilih. Semua nilai bisa diubah dengan mengeklik dua kali nilai tersebut, seperti nilai properti di panel Styles. Akan tetapi, perubahan tidak dijamin memberi dampak, karena ini tergantung pada detail penentuan posisi elemen sebenarnya.



Menampilkan perubahan lokal

Untuk menampilkan riwayat pengeditan langsung yang dibuat pada laman Anda:

  1. Di panel Styles, klik file yang sudah Anda ubah. DevTools akan membuka panel Sources.
  2. Klik kanan file.
  3. Pilih Local modifications.

Untuk menjelajah perubahan yang dibuat:


  • Luaskan nama file tingkat atas untuk melihat waktu  waktu saat perubahan terjadi saat perubahan terjadi.
  • Luaskan item tingkat kedua untuk melihat diff (sebelum dan sesudah) terkait dengan perubahan. Baris dengan latar belakang merah muda menandakan penghapusan, sedangkan baris dengan latar belakang hijau menandakan penambahan.

Mengurungkan perubahan

Jika Anda belum menyiapkan penulisan persisten, setiap kali Anda memuat ulang laman, semua pengeditan langsung akan hilang.

Jika Anda sudah menyiapkan penulisan persisten, untuk mengurungkan perubahan:


  • Gunakan Ctrl+Z (Windows) atau Cmd+Z (Mac) untuk secara cepat mengurungkan perubahan minor pada DOM atau gaya melalui panel Elements.



  • Untuk mengurungkan semua perubahan lokal yang dibuat pada file, buka panel Sources dan pilih revert di sebelah nama file.
daftar pustaka :
https://id.wikipedia.org/wiki/HTML
https://belajarphp.net/mengenal-heading-paragraf-dan-style-pada-html/
https://developers.google.com/web/tools/chrome-devtools/inspect-styles/?hl=id


Komentar