HTML, CSS, PHP: ദി അൾട്ടിമേറ്റ് ചീറ്റ് ഷീറ്റ്

in വിഭവങ്ങളും ഉപകരണങ്ങളും

ഞങ്ങളുടെ ഉള്ളടക്കം വായനക്കാരുടെ പിന്തുണയുള്ളതാണ്. നിങ്ങൾ ഞങ്ങളുടെ ലിങ്കുകളിൽ ക്ലിക്ക് ചെയ്താൽ, ഞങ്ങൾ ഒരു കമ്മീഷൻ നേടിയേക്കാം. ഞങ്ങൾ എങ്ങനെ അവലോകനം ചെയ്യുന്നു.

📥 എന്റെ ഡൗൺലോഡ് HTML, CSS, PHP ചീറ്റ് ഷീറ്റുകൾ, ഈ മൂന്ന് കോഡിംഗ് ഭാഷകളെക്കുറിച്ച് നിങ്ങൾ അറിയേണ്ടതും ഓർമ്മിക്കേണ്ടതുമായ എല്ലാം പൂർത്തിയാക്കുക.

പ്രോഗ്രാമിംഗ് ഭാഷകളുടെ എല്ലാ ടാഗുകളും വാക്യഘടനകളും മറ്റ് ഘടകങ്ങളും പലപ്പോഴും പരസ്പരം ബന്ധപ്പെട്ടിരിക്കുന്ന കോഡിംഗിന്റെ കല പൂർണ്ണമായും മാസ്റ്റർ ചെയ്യാൻ വർഷങ്ങളെടുക്കും.

കൂടുതൽ പരിചയസമ്പന്നരായ ഡെവലപ്പർമാർ പോലും പ്രത്യേക ജോലികൾക്കുള്ള ശരിയായ വാക്യഘടന മറക്കുന്ന കെണിയിൽ വീഴാം. അതുപോലെ, കൂടുതൽ പച്ചപ്പ് പ്രതീക്ഷിക്കുന്നത് യാഥാർത്ഥ്യമല്ല വെബ് ഡവലപ്പർമാർ കലയിൽ കുറ്റമറ്റ പിടി കിട്ടാൻ.

ഇതുകൊണ്ടാണ് HTML, CSS, PHP എന്നിവയ്‌ക്കായുള്ള ചീറ്റ് ഷീറ്റുകൾ നിങ്ങൾ എത്ര നാളായി പരിശീലിക്കുന്നു എന്നത് പരിഗണിക്കാതെ തന്നെ വളരെ ഉപയോഗപ്രദമാണ്. ശരിയായ കമാൻഡുകളും വാക്യഘടനകളും കണ്ടെത്തുന്നതിനുള്ള ഒരു ദ്രുത ഗൈഡായി ഇത് പ്രവർത്തിക്കുന്നു, യഥാർത്ഥ വെബ് വികസനത്തിൽ ശ്രദ്ധ കേന്ദ്രീകരിക്കാൻ നിങ്ങളെ അനുവദിക്കുന്നു.

ചുവടെ, നിങ്ങളുടെ കോഡിംഗ് ശ്രമങ്ങളിൽ നിങ്ങളെ സഹായിക്കുന്നതിന് ദ്രുത റിഫ്രഷറുകൾക്ക് മുമ്പുള്ള ദൃശ്യപരമായി ചായ്‌വുള്ള ചീറ്റ് ഷീറ്റുകൾ നിങ്ങൾ കണ്ടെത്തും. നിങ്ങളുടെ സൗകര്യത്തിനായി എളുപ്പത്തിൽ ബുക്ക്‌മാർക്കുചെയ്യാനോ സംരക്ഷിക്കാനോ പ്രിന്റ് ചെയ്യാനോ കഴിയുന്ന തരത്തിൽ ഞാൻ ഇത് ഉണ്ടാക്കിയിട്ടുണ്ട്.

എന്താണ് HTML?

HTML എന്നാൽ ഹൈപ്പർടെക്‌സ്‌റ്റ് മാർക്ക്അപ്പ് ലാംഗ്വേജ് - ഒരു വെബ് പേജിനും അതിന്റെ ഉള്ളടക്കത്തിനും ഘടന സൃഷ്ടിക്കാൻ ഉപയോഗിക്കുന്ന ഒരു കോഡ്.

ഈ മാർക്ക്അപ്പ് ഭാഷയിൽ ഉള്ളടക്കം ദൃശ്യമാക്കുന്നതിനോ ഒരു പ്രത്യേക രീതിയിൽ പ്രവർത്തിക്കുന്നതിനോ ഉപയോഗിക്കുന്ന ഘടകങ്ങളുടെ ഒരു ശ്രേണി ഉൾക്കൊള്ളുന്നു, ഇത് എല്ലാ വെബ്‌സൈറ്റുകളുടെയും ഫ്രണ്ട്-എൻഡ് കോഡിന്റെ പ്രധാന ഭാഗമാണ്.

വെബ് പേജുകളുടെ ഘടന വിവരിക്കുന്നതിനുള്ള ഭാഷയാണ് HTML ... HTML ഉപയോഗിച്ച്, എഴുത്തുകാർ മാർക്ക്അപ്പ് ഉപയോഗിച്ച് പേജുകളുടെ ഘടന വിവരിക്കുന്നു. ഖണ്ഡിക, ലിസ്റ്റ്, പട്ടിക മുതലായവ പോലുള്ള ഉള്ളടക്കത്തിന്റെ ഭാഷ ലേബൽ ഭാഗങ്ങളുടെ ഘടകങ്ങൾ. – W3.org-ൽ നിന്ന്

ഉദാഹരണത്തിന്, നിങ്ങൾക്ക് ഉള്ളടക്കത്തിന്റെ വ്യത്യസ്‌ത ഭാഗങ്ങൾ പൊതിയുകയോ പൊതിയുകയോ ചെയ്യാം - അവിടെ അടങ്ങുന്ന ടാഗുകൾക്ക് മറ്റൊരു പേജിലേക്ക് ഒരു വാക്കോ ചിത്രമോ ഹൈപ്പർലിങ്ക് ചെയ്യാൻ കഴിയും. വാക്കുകളെ ഇറ്റാലിക് ആക്കാനും ഫോണ്ടുകൾ വലുതോ ചെറുതോ ആക്കാനും നിങ്ങൾക്ക് ഇത് ഉപയോഗിക്കാം.

വഴി കണ്ടതുപോലെ W3, HTML നിങ്ങളെ ചെയ്യാൻ അനുവദിക്കുന്ന മറ്റ് ചില കാര്യങ്ങളിൽ ഇവ ഉൾപ്പെടുന്നു:

  • ഉപയോഗിച്ച് ഓൺലൈൻ പ്രമാണങ്ങൾ പ്രസിദ്ധീകരിക്കുന്നു തലക്കെട്ടുകൾ, വാചകം, പട്ടികകൾ, ലിസ്റ്റുകൾ, ഫോട്ടോകൾ, തുടങ്ങിയവ.
  • വഴി ഒരു ബട്ടണിൽ ക്ലിക്കിൽ ഓൺലൈൻ വിവരങ്ങൾ വീണ്ടെടുക്കുന്നു ഹൈപ്പർടെക്സ്റ്റ് ലിങ്കുകൾ.
  • ഡിസൈനിങ്ങ് ഫോമുകൾ വിദൂര സേവനങ്ങൾ ഉപയോഗിച്ച് ഇടപാടുകൾ നടത്തുന്നതിന് വിവരങ്ങൾക്കായി തിരയുക, റിസർവേഷനുകൾ നടത്തുക അല്ലെങ്കിൽ ഉൽപ്പന്നങ്ങൾ ഓർഡർ ചെയ്യുക, മറ്റ് പ്രവർത്തനങ്ങൾക്കിടയിൽ.
  • ഉൾപ്പെടെ സ്പ്രെഡ്ഷീറ്റുകൾ, വീഡിയോ ക്ലിപ്പുകൾ, മറ്റ് മീഡിയ എന്നിവ നിങ്ങളുടെ ഡോക്യുമെന്റുകളിലുള്ള ആപ്ലിക്കേഷനുകളും.

അതിനാൽ നിങ്ങൾ ലൈൻ ഉണ്ടാക്കുകയാണെങ്കിൽ "എന്റെ നായ വളരെ മധുരമാണ്" സ്വയം നിൽക്കുക, ഖണ്ഡിക ടാഗുകളിൽ (ഇതിൽ കൂടുതൽ പിന്നീട്) ഉൾപ്പെടുത്തിക്കൊണ്ട് ഇത് ഒരു ഖണ്ഡികയാണെന്ന് നിങ്ങൾക്ക് വ്യക്തമാക്കാൻ കഴിയും, അത് ഇതുപോലെ കാണപ്പെടും: എന്റെ നായ വളരെ മധുരമാണ്

HTML ഉം HTML5 ഉം തമ്മിലുള്ള വ്യത്യാസം എന്താണ്?

പേര് സൂചിപ്പിക്കുന്നത് പോലെ, HTML5 എന്നത് HTML സ്റ്റാൻഡേർഡിന്റെ അഞ്ചാമത്തെ പതിപ്പാണ്. ഭാഷയിലേക്ക് വീഡിയോയും ഓഡിയോയും സംയോജിപ്പിക്കുന്നതിനെ ഇത് പിന്തുണയ്ക്കുന്നു, ഇത് മൂന്നാം കക്ഷി പ്ലഗിന്നുകളുടെയും ഘടകങ്ങളുടെയും ആവശ്യകത കുറയ്ക്കുന്നു.

HTML ഉം HTML5 ഉം തമ്മിലുള്ള പ്രധാന വ്യത്യാസങ്ങൾ ചുവടെ:

എച്ച്ടിഎംഎൽ

  • ഫ്ലാഷ് പ്ലേയർ പിന്തുണയില്ലാതെ ഓഡിയോയും വീഡിയോയും പിന്തുണയ്ക്കുന്നില്ല.
  • താൽക്കാലിക ഡാറ്റ സംഭരിക്കുന്നതിന് കുക്കികൾ ഉപയോഗിക്കുന്നു.
  • ബ്രൗസറിൽ പ്രവർത്തിക്കാൻ JavaScipt-നെ അനുവദിക്കുന്നില്ല.
  • VML, Silver-light, Flash എന്നിവ പോലുള്ള വ്യത്യസ്ത സാങ്കേതികവിദ്യകൾ ഉപയോഗിച്ച് വെക്റ്റർ ഗ്രാഫിക്‌സിനെ അനുവദിക്കുന്നു.
  • വലിച്ചിടൽ ഇഫക്റ്റുകൾ അനുവദിക്കുന്നില്ല.
  • എല്ലാ പഴയ ബ്രൗസറുകളിലും പ്രവർത്തിക്കുന്നു.
  • മൊബൈൽ സൗഹൃദം കുറവാണ്.
  • ഡോക്‌ടൈപ്പ് പ്രഖ്യാപനം ദീർഘവും സങ്കീർണ്ണവുമാണ്.
  • nav, header എന്നിവ പോലുള്ള ഘടകങ്ങളും കൂടാതെ ചാർസെറ്റ്, a പോലുള്ള ആട്രിബ്യൂട്ടുകളും ഇല്ലsync, ഒപ്പം പിംഗ്.
  • ഒരു ബ്രൗസർ ഉപയോഗിച്ച് ഉപയോക്താക്കളുടെ യഥാർത്ഥ ജിയോലൊക്കേഷൻ നേടുന്നത് വളരെ ബുദ്ധിമുട്ടാണ്.
  • കൃത്യമല്ലാത്ത വാക്യഘടന കൈകാര്യം ചെയ്യാനാവില്ല.

HTML5

  • ഉപയോഗിച്ച് ഓഡിയോ, വീഡിയോ നിയന്ത്രണങ്ങൾ പിന്തുണയ്ക്കുന്നു ഒപ്പം ടാഗുകൾ.
  • ഓഫ്‌ലൈൻ ഡാറ്റ സംഭരിക്കുന്നതിന് SQL ഡാറ്റാബേസുകളും ആപ്ലിക്കേഷൻ കാഷെയും ഉപയോഗിക്കുന്നു.
  • JS വെബ് വർക്കർ API ഉപയോഗിച്ച് പശ്ചാത്തലത്തിൽ പ്രവർത്തിക്കാൻ JavaScript അനുവദിക്കുന്നു.
  • SVG, ക്യാൻവാസ് എന്നിവ പോലെ വെക്റ്റർ ഗ്രാഫിക്സ് HTML5 ന്റെ അടിസ്ഥാന ഭാഗമാണ്.
  • ഇഫക്റ്റുകൾ വലിച്ചിടാൻ അനുവദിക്കുന്നു.
  • രൂപങ്ങൾ വരയ്ക്കുന്നത് സാധ്യമാക്കുക.
  • Firefox, Mozilla, Chrome, Safari തുടങ്ങിയ എല്ലാ പുതിയ ബ്രൗസറുകളെയും പിന്തുണയ്ക്കുന്നു.
  • കൂടുതൽ മൊബൈൽ സൗഹൃദം.
  • ഡോക്‌ടൈപ്പ് പ്രഖ്യാപനം ലളിതവും എളുപ്പവുമാണ്.
  • നാവ്, ഹെഡർ, ഫൂട്ടർ തുടങ്ങിയ വെബ് ഘടനകൾക്കായി പുതിയ ഘടകങ്ങളുണ്ട്, കൂടാതെ ചാർസെറ്റിന്റെ ആട്രിബ്യൂട്ടുകളും ഉണ്ട്, async, ഒപ്പം പിംഗ്.
  • പ്രതീക എൻകോഡിംഗ് ലളിതവും എളുപ്പവുമാക്കുന്നു.
  • JS GeoLocation API ഉപയോഗിച്ച് ഉപയോക്തൃ ജിയോലൊക്കേഷൻ ട്രാക്കുചെയ്യാൻ അനുവദിക്കുന്നു.
  • കൃത്യമല്ലാത്ത വാക്യഘടന കൈകാര്യം ചെയ്യാൻ കഴിവുള്ള.
 

കൂടാതെ, HTML5-ൽ നിന്ന് പരിഷ്കരിച്ചതോ നീക്കം ചെയ്തതോ ആയ നിരവധി HTML ഘടകങ്ങൾ ഉണ്ട്. ഇതിൽ ഉൾപ്പെടുന്നവ:

  • – ആയി മാറ്റി
  • – ആയി മാറ്റി
  • – ആയി മാറ്റി
  • - നീക്കം ചെയ്തു
  • - നീക്കം ചെയ്തു
  • - നീക്കം ചെയ്തു
  • - പുതിയ ടാഗ് ഇല്ല. CSS ഉപയോഗിക്കുന്നു.
  • - പുതിയ ടാഗ് ഇല്ല. CSS ഉപയോഗിക്കുന്നു.
  • - പുതിയ ടാഗ് ഇല്ല. CSS ഉപയോഗിക്കുന്നു.
  • - പുതിയ ടാഗ് ഇല്ല. CSS ഉപയോഗിക്കുന്നു.
  • - പുതിയ ടാഗ് ഇല്ല. CSS ഉപയോഗിക്കുന്നു.

അതേസമയം, HTML5-ൽ പുതുതായി ചേർത്ത നിരവധി ഘടകങ്ങളും ഉൾപ്പെടുന്നു. ഇതിൽ ഉൾപ്പെടുന്നവ:

 

HTML5 ഉദാഹരണങ്ങൾ (കോഡ് പ്ലേഗ്രൗണ്ട്)

സെമാന്റിക് സ്ട്രക്ചർ ഉദാഹരണങ്ങൾ

In HTML5 ഒരു വെബ് പേജിന്റെ വിവിധ ഭാഗങ്ങൾ നിർവചിക്കാൻ ഉപയോഗിക്കാവുന്ന ചില സെമാന്റിക് ഘടകങ്ങൾ ഉണ്ട്. ഏറ്റവും സാധാരണമായവ ഇതാ:

html5 സെമാന്റിക് ഘടന ഘടകങ്ങൾ
അവലംബം: w3schools.com
 

തലക്കെട്ട്

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

അടിസ്ഥാന ടെക്സ്റ്റ് ഫോർമാറ്റിംഗ് ഉദാഹരണങ്ങൾ

തലക്കെട്ടുകൾ വരെ

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

പട്ടിക ഉദാഹരണങ്ങൾ

പട്ടിക തല, ശരീരം, കാൽ ഉദാഹരണം

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

മീഡിയ ഉദാഹരണങ്ങൾ

ചിത്രം

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

HTML ചീറ്റ് ഷീറ്റ് പൂർത്തിയാക്കുക

നിങ്ങൾ പരിചയസമ്പന്നനായ ഒരു ഡെവലപ്പർ ആണെങ്കിലും അല്ലെങ്കിൽ വ്യവസായത്തിൽ കാലുകൾ നനയ്ക്കാൻ ആഗ്രഹിക്കുന്ന ഒരാളാണെങ്കിലും, അത് എല്ലായ്പ്പോഴും ഒരു നേട്ടമുണ്ടാക്കാൻ സഹായിക്കുന്നു HTML ഫോർമാറ്റിംഗ് ചീറ്റ് ഷീറ്റ് സുലഭം. എല്ലാ ഘട്ടങ്ങളിലും നിങ്ങളെ സഹായിക്കാൻ കഴിയുന്ന ഒന്ന് ഞാൻ രൂപകൽപ്പന ചെയ്തിട്ടുണ്ട്.

html ചീറ്റ് ഷീറ്റ്

 

HTML ചീറ്റ് ഷീറ്റ് ഡൗൺലോഡ് ചെയ്യുക

 

എന്താണ് CSS?

കാസ്കേഡിംഗ് സ്റ്റൈൽ ഷീറ്റുകൾ അല്ലെങ്കിൽ CSS HTML ഘടകങ്ങൾ എങ്ങനെ സ്ക്രീനിൽ പ്രദർശിപ്പിക്കും എന്ന് വിവരിക്കുന്നു. ഇതിന് ഒരേ സമയം ഒന്നിലധികം പേജുകളുടെ ലേഔട്ടുകൾ നിയന്ത്രിക്കാൻ കഴിയുന്നതിനാൽ, ഇതിന് നിങ്ങൾക്ക് ധാരാളം സമയവും പരിശ്രമവും ലാഭിക്കാം.

നിറങ്ങൾ, ലേഔട്ട്, ഫോണ്ടുകൾ എന്നിവയുൾപ്പെടെ വെബ് പേജുകളുടെ അവതരണം വിവരിക്കുന്നതിനുള്ള ഭാഷയാണ് CSS. വലിയ സ്‌ക്രീനുകൾ, ചെറിയ സ്‌ക്രീനുകൾ അല്ലെങ്കിൽ പ്രിന്ററുകൾ പോലുള്ള വിവിധ തരം ഉപകരണങ്ങളിലേക്ക് അവതരണം പൊരുത്തപ്പെടുത്താൻ ഇത് ഒരാളെ അനുവദിക്കുന്നു. – W3.org-ൽ നിന്ന്

HTML ഉം CSS ഉം തമ്മിലുള്ള വ്യത്യാസം എന്താണ്?

HTML ഉം CSS ഉം വെബ്‌പേജുകളും ആപ്ലിക്കേഷനുകളും നിർമ്മിക്കാൻ ഉപയോഗിക്കുന്ന രണ്ട് ഭാഷകളാണെങ്കിലും, അവയ്ക്ക് വ്യത്യസ്ത പ്രവർത്തനങ്ങളുണ്ട്.

വെബ്‌പേജിൽ പ്രദർശിപ്പിക്കുന്ന ഘടനയും ഉള്ളടക്കവും നിർണ്ണയിക്കാൻ നിങ്ങൾ ഉപയോഗിക്കുന്നത് HTML ആണ്.

മറുവശത്ത്, സിഎസ്എസ് പരിഷ്ക്കരണത്തിനായി ഉപയോഗിക്കുന്നു വെബ് ഡിസൈൻ വെബ്‌പേജിലെ HTML ഘടകങ്ങളുടെ (ലേഔട്ട്, വിഷ്വൽ ഇഫക്‌റ്റുകൾ, പശ്ചാത്തല വർണ്ണം എന്നിവയുൾപ്പെടെ).

HTML ഘടനയും ഉള്ളടക്കവും സൃഷ്ടിക്കുന്നു, CSS രൂപകൽപ്പന അല്ലെങ്കിൽ ശൈലി ചെയ്യുന്നു. HTML ഉം CSS ഉം ഒരുമിച്ച് ഒരു വെബ്‌പേജ് ഇന്റർഫേസ് ഉണ്ടാക്കുന്നു.

എന്താണ് CSS വാക്യഘടന?

CSS വാക്യഘടന ഒരു സെലക്ടറും ഒരു ഡിക്ലറേഷൻ ബ്ലോക്കും ചേർന്നതാണ്.

ഡിക്ലറേഷൻ ബ്ലോക്കിൽ ഒന്നോ അതിലധികമോ ഡിക്ലറേഷനുകളോ CSS ന്റെ ജോഡികളോ ഒരു പ്രോപ്പർട്ടി നാമവും അവയ്ക്കിടയിൽ കോളണുള്ള ഒരു മൂല്യവും അടങ്ങിയിരിക്കുമ്പോൾ സ്റ്റൈൽ ചെയ്യേണ്ട HTML ഘടകം സെലക്ടർ നിർണ്ണയിക്കുന്നു.

ഡിക്ലറേഷനുകൾ അർദ്ധവിരാമങ്ങളാൽ വേർതിരിക്കപ്പെടുന്നു, ഡിക്ലറേഷൻ ബ്ലോക്കുകൾ എല്ലായ്പ്പോഴും ചുരുണ്ട ബ്രേസുകളിൽ ഉൾക്കൊള്ളുന്നു.

ഉദാഹരണത്തിന്, നിങ്ങളുടെ തലക്കെട്ട് 1-ന്റെ രൂപഭാവം പരിഷ്കരിക്കാൻ നിങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ, നിങ്ങളുടെ CSS വാക്യഘടന ഇതുപോലെയായിരിക്കും: h1 {color:red; ഫോണ്ട് വലുപ്പം:16pc;}

CSS ചീറ്റ് ഷീറ്റ് പൂർത്തിയാക്കുക

CSS ഉപയോഗിക്കാൻ വളരെ എളുപ്പമാണ്. ഒരുപാടു സെലക്ടർമാരും അവരെയെല്ലാം ഓർക്കുന്നത് ബുദ്ധിമുട്ടാണെങ്കിൽ അസാധ്യമാണെന്നുള്ള പ്രഖ്യാപനങ്ങളുമുണ്ട് എന്നതാണ് വെല്ലുവിളി. എന്നിരുന്നാലും, നിങ്ങൾ അവ മനഃപാഠമാക്കേണ്ടതില്ല.

ഇതാ ഒരു CSS, CSS3 എന്നിവയ്ക്കുള്ള ചീറ്റ് ഷീറ്റ് നിങ്ങൾക്ക് എപ്പോൾ വേണമെങ്കിലും ഉപയോഗിക്കാം.

CSS ചീറ്റ് ഷീറ്റ്

 

CSS ചീറ്റ് ഷീറ്റ് ഡൗൺലോഡ് ചെയ്യുക

 

എന്താണ് PHP?

PHP എന്നത് ഹൈപ്പർടെക്സ്റ്റ് പ്രീപ്രൊസസ്സർ എന്നതിന്റെ ചുരുക്കപ്പേരാണ്, ഡൈനാമിക് വെബ്‌സൈറ്റുകൾ, വെബ് ആപ്ലിക്കേഷനുകൾ അല്ലെങ്കിൽ സ്റ്റാറ്റിക് വെബ്‌സൈറ്റുകൾ എന്നിവ വികസിപ്പിക്കുന്നതിന് ഉപയോഗിക്കുന്ന ഒരു ജനപ്രിയ ഓപ്പൺ സോഴ്‌സ്, HTML- ഉൾച്ചേർത്ത സ്‌ക്രിപ്റ്റിംഗ് ഭാഷ.

മുതലുള്ള PHP ഒരു സെർവർ സൈഡ് ഭാഷയാണ്, അതിന്റെ സ്ക്രിപ്റ്റുകൾ സെർവറിൽ എക്സിക്യൂട്ട് ചെയ്യപ്പെടുന്നു (ബ്രൗസറിലല്ല), ബ്രൗസറിൽ അതിന്റെ ഔട്ട്പുട്ട് ഒരു പ്ലെയിൻ HTML ആണ്.

PHP എന്നത് വ്യാപകമായി ഉപയോഗിക്കപ്പെടുന്ന ഒരു ഓപ്പൺ സോഴ്‌സ് പൊതു-ഉദ്ദേശ്യ സ്‌ക്രിപ്റ്റിംഗ് ഭാഷയാണ്, അത് വെബ് ഡെവലപ്‌മെന്റിന് പ്രത്യേകിച്ചും അനുയോജ്യവും HTML-ൽ ഉൾച്ചേർക്കാവുന്നതുമാണ്. – PHP.net-ൽ നിന്ന്

ഈ സെർവർ സൈഡ് സ്ക്രിപ്റ്റിംഗ് ഭാഷ വിൻഡോസ്, മാക് ഒഎസ്, ലിനക്സ്, യുണിക്സ് എന്നിവയുൾപ്പെടെ വിവിധ ഓപ്പറേറ്റിംഗ് സിസ്റ്റങ്ങളിൽ പ്രവർത്തിക്കുന്നു. അപ്പാച്ചെ, ഐഐഎസ് തുടങ്ങിയ മിക്ക സെർവറുകളുമായും ഇത് പൊരുത്തപ്പെടുന്നു.

ASP, JSP പോലുള്ള മറ്റ് ഭാഷകളുമായി താരതമ്യം ചെയ്യുമ്പോൾ, തുടക്കക്കാർക്ക് PHP പഠിക്കാൻ എളുപ്പമാണ്. വിപുലമായ തലത്തിലുള്ള ഡെവലപ്പർമാർക്ക് ആവശ്യമായ നിരവധി ഫീച്ചറുകളും PHP വാഗ്ദാനം ചെയ്യുന്നു.

PHP-യും HTML-ഉം തമ്മിലുള്ള വ്യത്യാസം എന്താണ്?

രണ്ട് ഭാഷകളും നിർണായകമാണെങ്കിലും വെബ് വികസനം, PHP, HTML എന്നിവ പല തരത്തിൽ വ്യത്യസ്തമാണ്.

രണ്ട് ഭാഷകൾ എന്തിന് ഉപയോഗിക്കുന്നു എന്നതിലാണ് പ്രധാന വ്യത്യാസം.

ക്ലയന്റ് സൈഡിനായി HTML ഉപയോഗിക്കുന്നു (അല്ലെങ്കിൽ ഫ്രണ്ട് എൻഡ്) വികസനം, അതേസമയം സെർവർ സൈഡിനായി PHP ഉപയോഗിക്കുന്നു വികസനം.

ടെക്‌സ്‌റ്റ്, ഇമേജുകൾ, ടേബിളുകൾ, ഹൈപ്പർലിങ്കുകൾ എന്നിവ ചേർക്കൽ, ടെക്‌സ്‌റ്റ് ഫോർമാറ്റ് ചെയ്യൽ, വർണ്ണങ്ങൾ വ്യക്തമാക്കൽ എന്നിവ പോലുള്ള ഒരു വെബ്‌സൈറ്റിൽ ഉള്ളടക്കം സംഘടിപ്പിക്കുന്നതിന് ഉപയോഗിക്കുന്ന ഭാഷാ ഡെവലപ്പർമാർ ഉപയോഗിക്കുന്നതാണ് HTML.

അതേസമയം, ഒരു ഡാറ്റാബേസിൽ നിന്ന് ഡാറ്റ സംഭരിക്കാനും വീണ്ടെടുക്കാനും, ലോജിക്കൽ പ്രവർത്തനങ്ങൾ നടത്താനും, ഇമെയിലുകൾക്ക് അയയ്‌ക്കാനും മറുപടി നൽകാനും, ഫയലുകൾ അപ്‌ലോഡ് ചെയ്യാനും ഡൗൺലോഡ് ചെയ്യാനും, ഡെസ്‌ക്‌ടോപ്പ് ആപ്ലിക്കേഷനുകൾ വികസിപ്പിക്കാനും മറ്റും PHP ഉപയോഗിക്കുന്നു.

കോഡ് തരത്തിന്റെ കാര്യത്തിൽ, എച്ച്ടിഎംഎൽ സ്ഥിരമാണ്, അതേസമയം പിഎച്ച്പി ചലനാത്മകമാണ്. ഓരോ തവണ തുറക്കുമ്പോഴും ഒരു HTML കോഡ് എല്ലായ്പ്പോഴും സമാനമായിരിക്കും, അതേസമയം ഉപയോക്താവിന്റെ ബ്രൗസറിനെ ആശ്രയിച്ച് PHP ഫലങ്ങൾ വ്യത്യാസപ്പെടുന്നു.

പുതിയ ഡെവലപ്പർമാർക്ക്, രണ്ട് ഭാഷകളും പഠിക്കാൻ എളുപ്പമാണ്, എന്നിരുന്നാലും എച്ച്ടിഎംഎൽ ഉപയോഗിച്ച് PHP-യേക്കാൾ പഠന വക്രത കുറവാണ്.

PHP ചീറ്റ് ഷീറ്റ് പൂർത്തിയാക്കുക

നിങ്ങൾ PHP-യിൽ കൂടുതൽ പ്രാവീണ്യം നേടാനോ അതിനെക്കുറിച്ചുള്ള അറിവ് വികസിപ്പിക്കാനോ ആഗ്രഹിക്കുന്ന ഒരു തുടക്കക്കാരനായ പ്രോഗ്രാമർ ആണെങ്കിൽ, ഇതാ ഒരു PHP ചീറ്റ് ഷീറ്റ് നിങ്ങൾക്ക് വേഗത്തിൽ റഫർ ചെയ്യാൻ കഴിയും.

ഈ ചീറ്റ് ഷീറ്റിൽ PHP ഫംഗ്‌ഷനുകൾ അടങ്ങിയിരിക്കുന്നു - അവ വ്യാപകമായി ഉപയോഗിക്കുന്ന കോഡുകൾക്കുള്ള കുറുക്കുവഴികളാണ് - അവ സ്‌ക്രിപ്റ്റിംഗ് ഭാഷയിൽ നിർമ്മിച്ചിരിക്കുന്നു.

PHP ചീറ്റ് ഷീറ്റ്

 

PHP ചീറ്റ് ഷീറ്റ് ഡൗൺലോഡ് ചെയ്യുക

 

അൾട്ടിമേറ്റ് HTML, CSS, PHP ചീറ്റ് ഷീറ്റ്

നിങ്ങളൊരു പരിചയസമ്പന്നനായ ഡെവലപ്പർ ആണെങ്കിലും അല്ലെങ്കിൽ കോഡിംഗ് ആരംഭിക്കുന്ന ഒരാളാണെങ്കിലും, റഫറൻസിനായി നിങ്ങൾക്ക് എപ്പോഴും തിരികെ വരാനോ നിങ്ങളുടെ മെമ്മറി പുതുക്കാനോ കഴിയുന്ന എന്തെങ്കിലും ഉണ്ടായിരിക്കുന്നത് വളരെ സന്തോഷകരമാണ്.

ഒപ്പം വിനയാന്വിതരായ ഡെവലപ്പർമാർക്കുള്ള സമ്മാനമായും HTML, CSS, PHP, ഇതാ ഒരു അൾട്ടിമേറ്റ് ചീറ്റ് ഷീറ്റ്, ഈ മൂന്ന് കോഡിംഗ് ഭാഷകളെക്കുറിച്ച് നിങ്ങൾ അറിയേണ്ടതും ഓർമ്മിക്കേണ്ടതുമായ എല്ലാം പൂർത്തിയാക്കുക:

 

സംയോജിത HTML, CSS, PHP ചീറ്റ് ഷീറ്റ് ഡൗൺലോഡ് ചെയ്യുക

 

Mathias Ahlgren ആണ് സിഇഒയും സ്ഥാപകനും Website Rating, എഡിറ്റർമാരുടെയും എഴുത്തുകാരുടെയും ഒരു ആഗോള ടീമിനെ നയിക്കുക. ഇൻഫർമേഷൻ സയൻസിലും മാനേജ്മെന്റിലും ബിരുദാനന്തര ബിരുദം നേടിയിട്ടുണ്ട്. സർവ്വകലാശാലയിലെ ആദ്യകാല വെബ് ഡെവലപ്‌മെന്റ് അനുഭവങ്ങൾക്ക് ശേഷം അദ്ദേഹത്തിന്റെ കരിയർ എസ്‌ഇ‌ഒയിലേക്ക് തിരിയുകയായിരുന്നു. എസ്‌ഇഒ, ഡിജിറ്റൽ മാർക്കറ്റിംഗ്, വെബ് ഡെവലപ്‌മെൻ എന്നിവയിൽ 15 വർഷത്തിലേറെയായി. സൈബർ സെക്യൂരിറ്റിയിലെ സർട്ടിഫിക്കറ്റ് തെളിയിക്കുന്ന വെബ്‌സൈറ്റ് സുരക്ഷയും അദ്ദേഹത്തിന്റെ ശ്രദ്ധയിൽ ഉൾപ്പെടുന്നു. ഈ വൈവിധ്യമാർന്ന വൈദഗ്ധ്യം അദ്ദേഹത്തിന്റെ നേതൃത്വത്തിന് അടിവരയിടുന്നു Website Rating.

സാങ്കേതികവിദ്യ, ഇന്റർനെറ്റ് സുരക്ഷ, ഡിജിറ്റൽ മാർക്കറ്റിംഗ്, വെബ് ഡെവലപ്‌മെന്റ് എന്നിവയിൽ വൈദഗ്ധ്യമുള്ള വിദഗ്ധരായ എഡിറ്റർമാരുടെയും എഴുത്തുകാരുടെയും കൂട്ടായ ഗ്രൂപ്പാണ് "WSR ടീം". ഡിജിറ്റൽ മേഖലയോട് അഭിനിവേശമുള്ള, അവർ നന്നായി ഗവേഷണം ചെയ്‌തതും ഉൾക്കാഴ്ചയുള്ളതും ആക്‌സസ് ചെയ്യാവുന്നതുമായ ഉള്ളടക്കം നിർമ്മിക്കുന്നു. കൃത്യതയോടും വ്യക്തതയോടുമുള്ള അവരുടെ പ്രതിബദ്ധത ഉണ്ടാക്കുന്നു Website Rating ഡൈനാമിക് ഡിജിറ്റൽ ലോകത്ത് അറിവ് നിലനിർത്തുന്നതിനുള്ള ഒരു വിശ്വസനീയമായ ഉറവിടം.

അറിഞ്ഞിരിക്കുക! ഞങ്ങളുടെ വാർത്താക്കുറിപ്പിൽ ചേരുക
ഇപ്പോൾ സബ്‌സ്‌ക്രൈബുചെയ്യുക, വരിക്കാർക്ക് മാത്രമുള്ള ഗൈഡുകൾ, ടൂളുകൾ, ഉറവിടങ്ങൾ എന്നിവയിലേക്ക് സൗജന്യ ആക്‌സസ് നേടുക.
നിങ്ങൾക്ക് എപ്പോൾ വേണമെങ്കിലും അൺസബ്‌സ്‌ക്രൈബ് ചെയ്യാം. നിങ്ങളുടെ ഡാറ്റ സുരക്ഷിതമാണ്.
അറിഞ്ഞിരിക്കുക! ഞങ്ങളുടെ വാർത്താക്കുറിപ്പിൽ ചേരുക
ഇപ്പോൾ സബ്‌സ്‌ക്രൈബുചെയ്യുക, വരിക്കാർക്ക് മാത്രമുള്ള ഗൈഡുകൾ, ടൂളുകൾ, ഉറവിടങ്ങൾ എന്നിവയിലേക്ക് സൗജന്യ ആക്‌സസ് നേടുക.
നിങ്ങൾക്ക് എപ്പോൾ വേണമെങ്കിലും അൺസബ്‌സ്‌ക്രൈബ് ചെയ്യാം. നിങ്ങളുടെ ഡാറ്റ സുരക്ഷിതമാണ്.
ഇതിലേക്ക് പങ്കിടുക...