HTML, CSS u PHP: Il-Cheat Sheet Ultimate

in Riżorsi u Għodda

Il-kontenut tagħna huwa appoġġjat mill-qarrej. Jekk tikklikkja fuq il-links tagħna, nistgħu naqilgħu kummissjoni. Kif nirrevedu.

📥 Niżżel tiegħi HTML, CSS u PHP cheat sheets, imla b'dak kollu li għandek bżonn tkun taf u tiftakar dwar dawn it-tliet lingwi ta' kodifikazzjoni.

L-arti tal-kodifikazzjoni tista' tieħu s-snin biex tikkontrolla bis-sħiħ bit-tikketti, is-sintassi u l-elementi l-oħra kollha tal-lingwi tal-ipprogrammar ta' spiss magħquda.

Anke l-iżviluppaturi b'aktar esperjenza jistgħu jaqgħu fin-nassa li jinsa s-sintassi korretta għal kompiti partikolari. Bħala tali, mhuwiex realistiku li wieħed jistenna aktar aħdar żviluppaturi tal-web li jkollhom ħakma bla difetti ta 'l-arti.

Dan huwa għaliex cheat sheets għal HTML, CSS, u PHP huma estremament utli, irrispettivament minn kemm ilek tipprattika. Isservi bħala gwida ta 'malajr biex issib il-kmandi u s-sintassi t-tajbin, li jippermettulek tiffoka fuq l-iżvilupp attwali tal-web.

Hawn taħt, għandek issib cheat sheets inklinati viżwalment preċeduti minn aġġornamenti ta 'malajr biex jgħinuk fl-isforzi ta' kodifikazzjoni tiegħek. Għamilt ukoll biex tiġi faċilment immarkata, salvata jew stampata għall-konvenjenza tiegħek.

X'inhu HTML?

HTML tfisser Hypertext Markup Language – kodiċi li jintuża biex tinħoloq l-istruttura għal paġna web u l-kontenut tagħha.

Din il-lingwa tal-markup hija magħmula minn serje ta’ elementi li kienu jagħmlu l-kontenut jidher jew jiffunzjona b’ċertu mod u huwa parti kbira mill-kodiċi front-end ta’ kull websajt.

HTML huwa l-lingwa biex tiddeskrivi l-istruttura tal-paġni tal-Web... Bl-HTML, l-awturi jiddeskrivu l-istruttura tal-paġni bl-użu tal-markup. L-elementi tat-tikketta tal-lingwa biċċiet tal-kontenut bħal paragrafu, lista, tabella, eċċ. – minn W3.org

Pereżempju, tista 'tehmeż jew tgeżwer partijiet differenti tal-kontenut - fejn it-tikketti li jingħalqu jistgħu jagħmlu hyperlink kelma jew immaġini għal paġna oħra. Tista’ wkoll tuża dan biex tikteb kliem korsiv u tagħmel il-fonts akbar jew iżgħar, fost oħrajn.

Kif ġie nnotat minn W3, uħud mill-affarijiet l-oħra li jippermettilek li tagħmel HTML jinkludu:

  • Il-pubblikazzjoni ta' dokumenti onlajn ma' intestaturi, test, tabelli, listi, ritratti, Eċċ
  • Irkupru ta 'informazzjoni onlajn fil-ikklikkja ta' buttuna permezz links ipertesti.
  • Disinjar formoli għat-twettiq ta’ tranżazzjonijiet b’servizzi remoti biex tfittex informazzjoni, tagħmel riżervi, jew tordna prodotti, fost funzjonijiet oħra.
  • Inklużi spreadsheets, video clips, u midja oħra u applikazzjonijiet diġà fid-dokumenti tiegħek.

Mela kieku kellek tagħmel il-linja "Il-kelb tiegħi huwa ħelu ħafna" stand waħdu, tista 'tispeċifika li huwa paragrafu billi tagħlaqha f'tags tal-paragrafi (aktar dwar dan aktar tard), li tkun tidher bħal: Il-kelb tiegħi huwa ħelu ħafna

X'inhi d-differenza bejn HTML u HTML5?

Kif tissuġġerixxi l-isem, HTML5 hija l-ħames verżjoni tal-istandard HTML. Jappoġġja l-integrazzjoni tal-vidjo u l-awdjo fil-lingwa, li tnaqqas il-ħtieġa għal plugins u elementi ta 'partijiet terzi.

Hawn taħt huma d-differenzi ewlenin bejn HTML u HTML5:

HTML

  • Ma jappoġġjax awdjo u vidjo mingħajr appoġġ tal-flash player.
  • Juża cookies biex jaħżen data temporanja.
  • Ma jippermettix li JavaScipt jaħdem fil-browser.
  • Tippermetti grafika vettorjali billi tuża teknoloġiji differenti bħal VML, Silver-light, u Flash, fost oħrajn.
  • Ma jippermettix effetti drag and drop.
  • Jaħdem mal-browsers anzjani kollha.
  • Inqas faċli għall-mowbajl.
  • Id-dikjarazzjoni Doctype hija twila u kkumplikata.
  • M'għandux elementi bħal nav u header, kif ukoll attributi bħal charset, async, u ping.
  • Huwa diffiċli ħafna li tinkiseb GeoLocation vera tal-utenti billi tuża browser.
  • Ma jistax jimmaniġġja sintassi mhux preċiża.

HTML5

  • Jappoġġja kontrolli awdjo u vidjo bl-użu ta u tikketti.
  • Juża databases SQL u cache tal-applikazzjoni biex jaħżen data offline.
  • Jippermetti JavaScript jaħdem fl-isfond bl-użu ta 'JS Web worker API.
  • Il-grafika vettorjali hija parti fundamentali tal-HTML5, bħall-SVG u l-kanvas.
  • Jippermetti effetti drag and drop.
  • Agħmilha possibbli li tiġbed forom.
  • Jappoġġja l-browsers ġodda kollha bħal Firefox, Mozilla, Chrome, u Safari.
  • Aktar faċli għall-mowbajl.
  • Id-dikjarazzjoni Doctype hija sempliċi u faċli.
  • Għandu elementi ġodda għall-istrutturi tal-web bħal nav, header, u footer, fost oħrajn, u għandu wkoll attributi ta 'charset, async, u ping.
  • Jagħmel il-kodifikazzjoni tal-karattri sempliċi u faċli.
  • Jippermetti l-intraċċar tal-GeoLocation tal-utent bl-użu tal-API JS GeoLocation.
  • Kapaċi jimmaniġġa sintassi mhux preċiża.
 

Barra minn hekk, hemm ħafna elementi ta 'HTML li jew ġew modifikati jew imneħħija minn HTML5. Dawn jinkludu:

  • – Mibdul għal
  • – Mibdul għal
  • – Mibdul għal
  • – Imneħħija
  • – Imneħħija
  • – Imneħħija
  • – L-ebda tikketta ġdida. Juża CSS.
  • – L-ebda tikketta ġdida. Juża CSS.
  • – L-ebda tikketta ġdida. Juża CSS.
  • – L-ebda tikketta ġdida. Juża CSS.
  • – L-ebda tikketta ġdida. Juża CSS.

Sadanittant, HTML5 jinkludi wkoll numru ta 'elementi ġodda miżjuda. Dawn jinkludu:

 

Eżempji HTML5 (Kodiċi PlayGround)

Eżempji ta' Struttura Semantika

In HTML5 hemm xi elementi semantiċi li jistgħu jintużaw biex jiddefinixxu partijiet differenti ta 'paġna web. Hawn huma l-aktar komuni:

 

Header

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

Nav

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

Taqsima

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

Artikolu

<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>
 

Imwarrab (bar tal-ġenb)

<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

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

Eżempji Bażiċi ta' Formatting tat-Test

Intestaturi biex

<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>

Paragrafu ( & )

<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>
 

Mhux ordnat u lista ordnata

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

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

Blockquote u kwota

<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>
 

Link

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

Buttuna

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

Waqfa tal-linja

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

Linja orizzontali

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

Indirizz

<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>

Subscript & superscript

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

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

Abbrevjazzjoni

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

Kodiċi

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

Ħin

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

Imħassar

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

Eżempji ta' Tabella

Eżempju tar-ras tal-mejda, tal-ġisem u tas-sieq

<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>

Intestaturi ta' tabella, ringieli u eżempju ta' dejta

<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>
 

Eżempji tal-Midja

Immaġni

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

Stampa

<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>
 

Figura

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

Video

<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>
 

Kompli HTML Cheat Sheet

Kemm jekk int żviluppatur imħawwar jew xi ħadd li qed ifittex li jixxarrab saqajh fl-industrija, dejjem jgħin li jkollok HTML ifformattjar cheat sheet handy. U ddisinejt waħda li tista' tgħinek f'kull pass tat-triq.

html cheat sheet

 

Niżżel HTML Cheat Sheet

 

X'inhu CSS?

Folji tal-Istil Cascading jew CSS jiddeskrivi kif l-elementi HTML se jintwerew fuq l-iskrin. Minħabba li tista 'tikkontrolla t-tqassim ta' paġni multipli fl-istess ħin, tista 'tiffranka ħafna ħin u sforz.

CSS hija l-lingwa biex tiddeskrivi l-preżentazzjoni tal-paġni tal-Web, inklużi l-kuluri, it-tqassim u l-fonts. Jippermetti li wieħed jadatta l-preżentazzjoni għal tipi differenti ta 'apparat, bħal skrins kbar, skrins żgħar, jew printers. – minn W3.org

X'inhi d-differenza bejn HTML u CSS?

Filwaqt li HTML u CSS huma t-tnejn lingwi użati biex jinbnew paġni web u applikazzjonijiet, għandhom funzjonijiet differenti.

HTML huwa dak li tuża biex tiddetta l-istruttura u l-kontenut li se jintwerew fuq il-paġna web.

CSS, min-naħa l-oħra, jintuża għall-modifika tal- web disinn tal-elementi HTML fuq il-paġna web (inkluż it-tqassim, l-effetti viżwali, u l-kulur tal-isfond).

HTML joħloq l-istruttura u l-kontenut, CSS jagħmel id-disinn jew l-istil. Flimkien, HTML u CSS jiffurmaw interface tal-webpage.

X'inhi CSS Sintassi?

Sintassi CSS huwa magħmul minn selettur u blokk ta’ dikjarazzjoni.

Is-selettur jiddetermina l-element HTML li għandu jiġi stilat filwaqt li l-blokk tad-dikjarazzjoni fih dikjarazzjoni waħda jew aktar jew pari ta’ CSS isem ta’ proprjetà u valur b’kolon bejniethom.

Id-dikjarazzjonijiet huma separati b'punt u virgola u l-blokki tad-dikjarazzjoni huma dejjem magħluqa fi ċingi kaboċċi.

Pereżempju, jekk tixtieq timmodifika l-mod kif tidher l-intestatura 1 tiegħek, is-sintassi tas-CSS tiegħek tidher bħal xi ħaġa bħal din: h1 {color:red; font-size:16pc;}

Tlesti CSS Cheat Sheet

CSS huwa faċli biżżejjed biex jintuża. L-isfida hi li hemm ħafna seletturi u dikjarazzjonijiet li jiftakruhom kollha diffiċli jekk mhux impossibbli. Madankollu, m'għandekx għalfejn timmemorizzahom.

Hawn hawn cheat sheet għal CSS u CSS3 li tista' tuża ghaċ.

CSS Cheat Sheet

 

Niżżel is-CSS Cheat Sheet

 

X'inhu PHP?

PHP huwa akronimu għal Hypertext Preprocessor, lingwa ta' scripting popolari ta' sors miftuħ, inkorporat fl-HTML użata għall-iżvilupp ta' websajts dinamiċi, applikazzjonijiet tal-web, jew websajts statiċi.

Peress PHP hija lingwa fuq in-naħa tas-server, l-iskripts tiegħu huma esegwiti fuq is-server (mhux fil-browser), u l-output tiegħu huwa HTML sempliċi fuq il-browser.

PHP hija lingwa ta' skriptjar għal skopijiet ġenerali ta' sors miftuħ li tintuża ħafna li hija adattata b'mod speċjali għall-iżvilupp tal-web u tista' tiġi inkorporata fl-HTML. – minn PHP.net

Din il-lingwa ta' scripting fuq is-server taħdem fuq varjetà ta' sistemi operattivi, inklużi Windows, Mac OS, Linux, u Unix. Huwa wkoll kompatibbli mal-biċċa l-kbira tas-servers bħal Apache u IIS.

Meta mqabbel ma 'lingwi oħra bħal ASP u JSP, PHP huwa faċli biex titgħallem għal dawk li jibdew. PHP joffri wkoll ħafna karatteristiċi li l-iżviluppaturi ta 'livell avvanzat jeħtieġu.

X'inhi d-differenza bejn PHP u HTML?

Għalkemm iż-żewġ lingwi huma kruċjali biex iżvilupp tal-web, PHP u HTML huma differenti f'diversi modi.

Id-differenza ewlenija tinsab f'xiex jintużaw iż-żewġ lingwi.

HTML jintuża għan-naħa tal-klijent (jew front-end) żvilupp, filwaqt li PHP jintuża għan-naħa tas-server iżvilupp.

L-HTML huwa l-lingwa li jużaw l-iżviluppaturi biex jorganizzaw il-kontenut fuq websajt, bħall-inserzjoni ta’ test, immaġini, tabelli, u hyperlinks, ifformattjar ta’ test, u jispeċifikaw il-kuluri.

Sadanittant, PHP jintuża biex jaħżen u jirkupra data minn database, iwettaq operazzjonijiet loġiċi, jibgħat u jwieġeb emails, itella u tniżżel fajls, jiżviluppaw applikazzjonijiet tad-desktop, u aktar.

F'termini tat-tip ta' kodiċi, HTML huwa statiku filwaqt li PHP huwa dinamiku. Kodiċi HTML huwa dejjem l-istess kull darba li jinfetaħ, filwaqt li r-riżultati PHP jvarjaw skont il-browser tal-utent.

Għal żviluppaturi ġodda, iż-żewġ lingwi huma faċli biex jitgħallmu, għalkemm il-kurva tat-tagħlim hija iqsar b'HTML milli PHP.

Tlesti PHP Cheat Sheet

Jekk int programmatur novizzi li trid tkun aktar profiċjenti fil-PHP jew tespandi l-għarfien tiegħek dwaru, hawn hawn PHP cheat sheet tista' malajr tirreferi għaliha.

Din il-cheat sheet tikkonsisti f'funzjonijiet PHP - li huma shortcuts għall-kodiċijiet użati ħafna - li huma mibnija fil-lingwa tal-iskript.

PHP Cheat Sheet

 

Niżżel PHP Cheat Sheet

 

Il-Cheat Sheet Ultimate HTML, CSS u PHP

Kemm jekk int żviluppatur imħawwar jew sempliċement xi ħadd li qed jibda l-kodifikazzjoni, huwa tajjeb li jkollok xi ħaġa li tista' dejjem terġa' lura għaliha għal referenza jew sempliċement iġedded il-memorja tiegħek.

U bħala rigal lill-iżviluppaturi li juggle bejniethom HTML, CSS, u PHP, hawnhekk hija cheat sheet ULTIMATE, imla b'dak kollu li għandek bżonn tkun taf u tiftakar dwar dawn it-tliet lingwi ta' kodifikazzjoni:

 

Niżżel Kombinat HTML, CSS & PHP Cheat Sheet

 

Dwar l-Awtur

Matt Ahlgren

Mathias Ahlgren huwa l-Kap Eżekuttiv u l-fundatur ta Website Rating, imexxi tim globali ta' edituri u kittieba. Huwa għandu master's fix-xjenza tal-informazzjoni u l-ġestjoni. Il-karriera tiegħu mxiet lejn is-SEO wara esperjenzi bikrija tal-iżvilupp tal-web matul l-università. B'aktar minn 15-il sena fis-SEO, il-marketing diġitali, u l-iżvilupp tal-web. L-enfasi tiegħu tinkludi wkoll is-sigurtà tal-websajt, evidenzjata minn ċertifikat fis-Cyber ​​Security. Din il-kompetenza diversa tirfed it-tmexxija tiegħu fi Website Rating.

Tim WSR

It-"WSR Team" huwa l-grupp kollettiv ta’ edituri u kittieba esperti li jispeċjalizzaw fit-teknoloġija, is-sigurtà tal-internet, il-marketing diġitali, u l-iżvilupp tal-web. Passjonati dwar l-isfera diġitali, huma jipproduċu kontenut riċerkat tajjeb, insightful, u aċċessibbli. L-impenn tagħhom għall-eżattezza u ċ-ċarezza jagħmel Website Rating riżorsa fdata biex tibqa’ infurmata fid-dinja diġitali dinamika.

Ibqa' infurmat! Ingħaqad man-newsletter tagħna
Abbona issa u ksib aċċess b'xejn għal gwidi, għodod u riżorsi għall-abbonati biss.
Tista' tneħħi l-abbonament fi kwalunkwe ħin. Id-dejta tiegħek hija sigura.
Ibqa' infurmat! Ingħaqad man-newsletter tagħna
Abbona issa u ksib aċċess b'xejn għal gwidi, għodod u riżorsi għall-abbonati biss.
Tista' tneħħi l-abbonament fi kwalunkwe ħin. Id-dejta tiegħek hija sigura.
Aqsam lil...