HTML, CSS dan PHP: Lembar Curang Utama

📥 Unduh file saya Lembar contekan HTML, CSS dan PHP, lengkap dengan semua yang perlu Anda ketahui dan ingat terkait ketiga bahasa coding ini.

• Apa itu HTML?
• Contoh HTML5 (PlayGround Kode)
• 📥 Lembar Cheat HTML
• Apa itu CSS?
• 📥 Lembar Cheat CSS
• Apa itu PHP?
• 📥 Lembar Cheat PHP
• 📥 HTML CSS dan Lembar Cheat PHP

Seni pengkodean membutuhkan waktu bertahun-tahun untuk dikuasai sepenuhnya dengan semua tag, sintaksis, dan elemen lain dari bahasa pemrograman yang sering terjalin.

Bahkan pengembang yang lebih berpengalaman pun bisa jatuh ke dalam perangkap lupa sintaks yang benar untuk tugas-tugas tertentu. Dengan demikian, tidak realistis mengharapkan lebih hijau pengembang web untuk memiliki pemahaman yang sempurna tentang seni.

Inilah sebabnya mengapa lembar contekan untuk HTML, CSS, dan PHP sangat berguna, terlepas dari berapa lama Anda telah berlatih. Ini berfungsi sebagai panduan cepat untuk menemukan perintah dan sintaks yang tepat, memungkinkan Anda untuk fokus pada pengembangan web yang sebenarnya.

Di bawah ini, Anda akan menemukan lembar contekan yang cenderung visual didahului dengan penyegaran cepat untuk membantu Anda dalam upaya pengkodean Anda. Saya juga membuatnya mudah ditandai, disimpan, atau dicetak demi kenyamanan Anda.

Apa itu HTML?

HTML adalah singkatan dari Hypertext Markup Language - kode yang digunakan untuk membuat struktur untuk halaman web dan isinya.

Bahasa markup ini terdiri dari serangkaian elemen yang digunakan untuk membuat konten muncul atau berfungsi dengan cara tertentu dan merupakan bagian utama dari kode front-end setiap situs web.

HTML adalah bahasa untuk mendeskripsikan struktur halaman web… Dengan HTML, penulis mendeskripsikan struktur halaman dengan menggunakan markup. Elemen-elemen dari potongan label bahasa konten seperti paragraf, daftar, tabel, dan sebagainya. - dari W3.org

Misalnya, Anda bisa mengapit atau membungkus bagian konten yang berbeda - di mana tag yang melingkupi bisa membuat kata atau gambar hyperlink ke halaman lain. Anda juga dapat menggunakan ini untuk memiringkan kata dan membuat font lebih besar atau lebih kecil, antara lain.

Seperti dicatat oleh W3, beberapa hal lain yang memungkinkan HTML untuk Anda lakukan termasuk:

• Menerbitkan dokumen online dengan judul, teks, tabel, daftar, foto, Dll
• Mengambil informasi online dengan mengklik tombol melalui tautan hypertext.
• Merancang bentuk untuk melakukan transaksi dengan layanan jarak jauh ke mencari informasi, melakukan reservasi, atau memesan produk, di antara fungsi lainnya.
• Termasuk spreadsheet, klip video, dan media lainnya dan aplikasi sudah ada di dokumen Anda.

Jadi jika Anda membuat garis “Anjingku sangat manis” berdiri sendiri, Anda dapat menentukan bahwa itu adalah paragraf dengan melampirkannya dalam tag paragraf (lebih lanjut tentang ini nanti), yang akan terlihat seperti: Anjing saya sangat manis

Apa perbedaan antara HTML dan HTML5?

Seperti namanya, HTML5 adalah versi kelima dari standar HTML. Ini mendukung integrasi video dan audio ke dalam bahasa, yang mengurangi kebutuhan akan plugin dan elemen pihak ketiga.

Di bawah ini adalah perbedaan utama antara HTML dan HTML5:

Selain itu, ada banyak elemen HTML yang telah dimodifikasi atau dihapus dari HTML5. Ini termasuk:

• - Berubah menjadi
• - Berubah menjadi
• - Berubah menjadi
• - Dihapus
• - Dihapus
• - Dihapus
• - Tidak ada label baru. Menggunakan CSS.
• - Tidak ada label baru. Menggunakan CSS.
• - Tidak ada label baru. Menggunakan CSS.
• - Tidak ada label baru. Menggunakan CSS.
• - Tidak ada label baru. Menggunakan CSS.

Sementara itu, HTML5 juga menyertakan sejumlah elemen yang baru ditambahkan. Ini termasuk:

Contoh HTML5 (PlayGround Kode)

Contoh Struktur Semantik

In HTML5 ada beberapa elemen semantik yang dapat digunakan untuk mendefinisikan berbagai bagian halaman web. Berikut adalah yang paling umum:

<header>
  <h1>Guide to Search Engines</h1>
</header>

<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Blog</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</nav>

<section>
  <h2>Internet Browsers</h2>
  <p>Google Chrome, Mozilla Firefox, Internet Explorer, Safari and Opera dominate the browser market.</p>
</section>

<article>
  <h3>Google Chrome</h3>
  <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p>
</article>

<p>Google Chrome is a cross-platform web browser developed by Google.</p>

<aside>
  <h4>History of Mozilla</h4>
  <p>Mozilla is a free software community founded in 1998.</p>
</aside>

<footer>
  <p>Copyright Example.com. Read our <a href="#">privacy policy</a>.</p>
</footer>

Contoh Pemformatan Teks Dasar

<h1>Heading level 1</h1>
 <h2>Heading level 2</h2>
  <h3>Heading level 3</h3>
   <h4>Heading level 4</h4>
    <h5>Heading level 5</h5>
     <h6>Heading level 6</h6>

<p>Paragraph of text with a sentence of words.</p>

<p>Paragraph of text with a word that has <em>emphasis</em>.</p>

<p>Paragraph of text with a word that has <strong>importance</strong>.</p>

<ul>
  <li>HTML5</li>
  <li>CSS3</li>
  <li>PHP</li>
</ul>

<ol>
  <li>HTML5</li>
  <li>CSS3</li>
  <li>PHP</li>
</ol>

<blockquote cite="https://www.huxley.net/bnw/four.html">
  <p>Words can be like X-rays, if you use them properly – they'll go through anything. You read and you're pierced.</p>
</blockquote>
  <cite>– Aldous Huxley, Brave New World</cite>

<p>Search for it on <a href="https://www.google.com/" title="Google search engine">Google</a>

<button name="button">I am a Button. Click me!</button>

<p>The line break tag produces a<br> line break in<br> text (carriage-return)</p>

<p>This is the first paragraph of text.</p><hr><p>This is second paragraph of text.</p>

<address>
Acme Inc<br>
PO Box 555, New York, USA<br>
Call us: <a href="tel:+1-555-555-555">+1-555-555-555</a><br>
Email us: <a href="mailto:[email protected]">[email protected]</a>
</address>

<p>The chemical formula of water is H<sub>2</sub>O</p>

<p>This text is <sup>superscripted</sup></p>

<p><abbr title="Hypertext Markup Language">HTML</abbr> is easy to learn.</p>

<p>This is normal text. <code>This is code.</code> This is normal text.</p>

<p>The movie starts at <time>20:00</time>.</p>

<p>I am <del>wrong</del> right, you are <del>right</del> wrong.</p>

Contoh Tabel

<table>
<thead>
     <tr> ...table header... </tr>
</thead>
<tfoot>
     <tr> ...table footer... </tr>
</tfoot>
<tbody>
     <tr> ...first row... </tr>
     <tr> ...second row... </tr>
</tbody>
<tbody>
     <tr> ...first row... </tr>
     <tr> ...second row... </tr>
     <tr> ...third row... </tr>
</tbody>
</table>

<table>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Jane</td>
    <td>Doe</td>
    <td>34</td>
  </tr>
</table>

Contoh Media

<img src="images/dinosaur.png" 
     alt="The head and torso of a dinosaur skeleton;it has a large head with long sharp teeth"/>

<picture>
  <source type="image/svg+xml" srcset="pyramid.svg">
  <source type="image/webp" srcset="pyramid.webp">
  <img src="pyramid.png" alt="regular pyramid built from four equilateral triangles">
</picture>

<figure>
    <img src="/images/frog.png" alt="Tree frog" />
    <figcaption>Tree frog by David Clode on Unsplash</figcaption>
</figure>

<video controls width="400" height="400" autoplay loop muted poster="poster.png">
  <source src="rabbit.mp4" type="video/mp4">
  <source src="rabbit.webm" type="video/webm">
  <source src="rabbit.ogg" type="video/ogg"> 
  <source src="rabbit.mov" type="video/quicktime">
  <p>Your browser doesn't support HTML5 video. Here is a <a href="rabbit.mp4">link to the video</a> instead.</p>
</video>

Lembar Cheat HTML Lengkap

Baik Anda seorang pengembang berpengalaman atau seseorang yang hanya ingin berbasah-basahan di industri ini, memiliki Lembar contekan pemformatan HTML berguna. Dan saya telah merancang satu yang dapat membantu Anda di setiap langkah.

Unduh HTML Cheat Sheet

Apa itu CSS?

CSS atau Cascading Style Sheets menjelaskan bagaimana elemen HTML akan ditampilkan di layar. Karena dapat mengontrol tata letak beberapa halaman secara bersamaan, ini dapat menghemat banyak waktu dan tenaga.

CSS adalah bahasa untuk mendeskripsikan presentasi halaman web, termasuk warna, tata letak, dan font. Ini memungkinkan seseorang untuk menyesuaikan presentasi ke berbagai jenis perangkat, seperti layar besar, layar kecil, atau printer. - dari W3.org

Apa Perbedaan Antara HTML dan CSS?

Meskipun HTML dan CSS adalah bahasa yang digunakan untuk membangun halaman web dan aplikasi, keduanya memiliki fungsi yang berbeda.

HTML adalah apa yang Anda gunakan untuk menentukan struktur dan konten yang akan ditampilkan di halaman web.

CSS, di sisi lain, digunakan untuk modifikasi file desain web elemen HTML di halaman web (termasuk tata letak, efek visual, dan warna latar belakang).

HTML menciptakan struktur dan konten, CSS melakukan desain atau gaya. Bersama-sama, HTML dan CSS membentuk antarmuka halaman web.

Apa itu Sintaks CSS?

Sintaks CSS terdiri dari pemilih dan blok deklarasi.

Selektor menentukan elemen HTML yang akan diberi gaya sementara blok deklarasi berisi satu atau beberapa deklarasi atau pasangan CSS, nama properti dan nilai dengan titik dua di antara keduanya.

Deklarasi dipisahkan oleh titik koma dan blok deklarasi selalu diapit oleh kurung kurawal.

Misalnya, jika Anda ingin mengubah tampilan heading 1 Anda, sintaks CSS Anda akan terlihat seperti ini: h1 {color: red; ukuran font: 16pc;}

Lembar Cheat CSS Lengkap

CSS cukup mudah digunakan. Tantangannya adalah bahwa ada banyak pemilih dan deklarasi yang mengingat semuanya itu sulit atau bahkan mustahil. Anda tidak harus menghafalnya.

Berikut adalah lembar contekan untuk CSS dan CSS3 yang dapat Anda gunakan kapan saja.

Unduh Lembar Cheat CSS

Apa itu PHP?

PHP adalah singkatan dari Hypertext Preprocessor, bahasa skrip sumber terbuka tersemat HTML yang populer digunakan untuk mengembangkan situs web dinamis, aplikasi web, atau situs web statis.

Sejak PHP adalah bahasa sisi server, skripnya dijalankan di server (bukan di browser), dan outputnya adalah HTML biasa di browser.

PHP adalah bahasa skrip serba guna sumber terbuka yang banyak digunakan dan sangat cocok untuk pengembangan web dan dapat disematkan ke dalam HTML. - dari PHP.net

Bahasa skrip sisi server ini berjalan di berbagai sistem operasi, termasuk Windows, Mac OS, Linux, dan Unix. Ini juga kompatibel dengan sebagian besar server seperti Apache dan IIS.

Dibandingkan dengan bahasa lain seperti ASP dan JSP, PHP mudah dipelajari untuk pemula. PHP juga menawarkan banyak fitur yang dibutuhkan oleh pengembang tingkat lanjut.

Apa Perbedaan Antara PHP dan HTML?

Meskipun kedua bahasa itu penting untuk pengembangan web, PHP dan HTML berbeda dalam beberapa hal.

Perbedaan utamanya terletak pada kegunaan kedua bahasa tersebut.

HTML digunakan untuk sisi klien (atau front-end) pengembangan, sementara PHP digunakan untuk sisi server pembangunan.

HTML adalah bahasa yang digunakan pengembang untuk mengatur konten di situs web, seperti memasukkan teks, gambar, tabel, dan hyperlink, memformat teks, dan menentukan warna.

Sedangkan PHP digunakan untuk menyimpan dan mengambil data dari database, melakukan operasi logis, mengirim dan membalas email, mengupload dan mendownload file, mengembangkan aplikasi desktop, dan banyak lagi.

Dalam hal jenis kode, HTML statis sedangkan PHP dinamis. Kode HTML selalu sama setiap kali dibuka, sedangkan hasil PHP berbeda-beda bergantung pada browser pengguna.

Untuk developer baru, kedua bahasa tersebut mudah dipelajari, meskipun kurva pembelajarannya lebih pendek dengan HTML daripada PHP.

Selesaikan Lembar Cheat PHP

Jika Anda seorang programmer pemula yang ingin lebih mahir dalam PHP atau memperluas pengetahuan Anda tentangnya, berikut adalah Lembar contekan PHP Anda dapat dengan cepat merujuk ke.

Lembar sontekan ini terdiri dari fungsi PHP - yang merupakan pintasan untuk kode yang banyak digunakan - yang dibangun ke dalam bahasa skrip.

Unduh Lembar Cheat PHP

Lembar Cheat HTML, CSS, dan PHP Utama

Baik Anda seorang pengembang berpengalaman atau hanya seseorang yang memulai pengkodean, sangat menyenangkan memiliki sesuatu yang selalu dapat Anda lihat kembali untuk referensi atau sekadar menyegarkan ingatan Anda.

Dan sebagai hadiah untuk pengembang yang sering berpindah-pindah HTML, CSS, dan PHP, berikut adalah lembar contekan ULTIMATE, lengkap dengan semua yang perlu Anda ketahui dan ingat tentang ketiga bahasa pengkodean ini:

Unduh Lembar Cheat HTML, CSS & PHP Gabungan