📥 زما ډاونلوډ کړئ HTML، CSS او PHP چیټ شیټونهد هر هغه څه سره بشپړ کړئ چې تاسو ورته اړتیا لرئ د دې دریو کوډینګ ژبو په اړه پوه شئ او په یاد ولرئ.
- HTML څه شی دی؟
- د HTML5 مثالونه (د لوبې ډګر کوډ)
- 📥 HTML چیټ شیټ
- CSS څه شی دی؟
- 📥 د CSS چیټ شیټ
- پی ایچ پی څه شی دی؟
- 📥 د پی ایچ پی چیټ شیټ
- 📥 HTML CSS او PHP چیټ شیټ
د کوډ کولو هنر کولی شي کلونه وخت ونیسي چې په بشپړ ډول د ټولو ټاګونو ، ترکیبونو او د برنامو ژبو نورو عناصرو سره چې ډیری وختونه یو له بل سره تړلي وي ماسټر شي.
حتی ډیر تجربه لرونکي پراختیا کونکي کولی شي د ځانګړو دندو لپاره د سم ترکیب هیرولو جال کې راشي. د ورته په څیر، دا غیر واقعیت دی چې نور زرغون تمه وکړي د ویب خپرونکي د هنر بې عیب درک ترلاسه کول.
له دې امله د HTML، CSS، او PHP لپاره د شیټ شیټونه خورا ګټور دي، پرته له دې چې تاسو څومره وخت تمرین کوئ. دا د سم حکمونو او ترکیبونو موندلو لپاره د ګړندي لارښود په توګه کار کوي ، تاسو ته اجازه درکوي په ریښتیني ویب پراختیا تمرکز وکړئ.
لاندې، تاسو به ستاسو د کوډ کولو هڅو کې ستاسو سره د مرستې لپاره د ګړندي ریفریشرونو څخه دمخه د لید لیدونکي خیانت شیټونه ومومئ. ما دا هم ستاسو د اسانتیا لپاره په اسانۍ سره بک مارک ، خوندي یا چاپ کولو لپاره رامینځته کړی.
HTML څه شی دی؟
HTML د Hypertext Markup Language لپاره ولاړ دی - یو کوډ چې د ویب پاڼې او د هغې مینځپانګې لپاره جوړښت رامینځته کولو لپاره کارول کیږي.
دا مارک اپ ژبه د یو لړ عناصرو څخه جوړه شوې ده چې د مینځپانګې څرګندولو یا په یو ځانګړي ډول فعالیت کولو لپاره کارول کیږي او د هرې ویب پاڼې د مخکني کوډ لویه برخه ده.
HTML د ویب پاڼو جوړښت تشریح کولو ژبه ده ... د HTML سره، لیکوالان د مارک اپ په کارولو سره د پاڼو جوړښت تشریح کوي. د ژبې عناصر د محتوياتو ټوټې لکه پراګراف، لیست، جدول او داسې نور. – له W3.org څخه
د مثال په توګه، تاسو کولی شئ د محتوياتو مختلفې برخې تړل یا وتړئ - چیرې چې تړل شوي ټاګونه کولی شي د بلې پاڼې لپاره یوه کلمه یا عکس هایپر لینک جوړ کړي. تاسو کولی شئ دا د ټکي ایټالیک کولو لپاره هم وکاروئ او د نورو په مینځ کې فونټونه لوی یا کوچني کړئ.
لکه څرنګه چې د W3، ځینې نور شیان چې HTML تاسو ته اجازه درکوي پدې کې شامل دي:
- د آنلاین اسنادو خپرول سرلیکونه، متن، میزونه، لیستونه، عکسونه، او نور
- له لارې د تڼۍ په کلیک کولو سره آنلاین معلومات ترلاسه کول د هایپر متن لینکونه.
- ډیزاین فورمې د لرې پرتو خدماتو سره د معاملو ترسره کولو لپاره د معلوماتو لټون کول، خوندي کول، یا د محصولاتو امر کولد نورو دندو په منځ کې.
- په ګډون سپریڈ شیټونه، ویډیو کلپونه، او نورې رسنۍ او غوښتنلیکونه دمخه ستاسو په اسنادو کې دي.
نو که تاسو لاین جوړ کړئ "زما سپی ډیر خوږ دی" پخپله ودریږئ، تاسو کولی شئ مشخص کړئ چې دا د پراګراف ټګونو کې د تړلو له لارې یوه پراګراف دی (په دې اړه نور وروسته)، کوم چې به داسې ښکاري: زما سپی ډیر خوږ دی
د HTML او HTML5 ترمنځ توپیر څه دی؟
لکه څنګه چې د نوم وړاندیز کوي، HTML5 د HTML معیار پنځمه نسخه ده. دا په ژبه کې د ویډیو او آډیو ادغام ملاتړ کوي ، کوم چې د دریمې ډلې پلگ انونو او عناصرو اړتیا کموي.
لاندې د HTML او HTML5 ترمنځ اصلي توپیرونه دي:
د HTML
- د فلش پلیر ملاتړ پرته د آډیو او ویډیو ملاتړ نه کوي.
- د لنډمهاله معلوماتو ذخیره کولو لپاره کوکیز کاروي.
- JavaScipt ته اجازه نه ورکوي چې په براوزر کې چلیږي.
- د نورو په مینځ کې د مختلف ټیکنالوژیو لکه VML ، سلور ر lightا او فلش په کارولو سره د ویکتور ګرافیکونو ته اجازه ورکوي.
- د ډریګ او ډراپ اغیزو ته اجازه نه ورکوي.
- د ټولو زړو براوزرونو سره کار کوي.
- لږ ګرځنده دوستانه.
- د Doctype اعالمیه اوږده او پیچلې ده.
- د nav او سرلیک په څیر عناصر نلري، په بیله بیا د چارسیټ، async، او ping په څیر ځانګړتیاوې.
- د براوزر په کارولو سره د کاروونکو ریښتیني جیو موقعیت ترلاسه کول خورا ستونزمن دي.
- ناسم ترکیب نشي اداره کولی.
HTML5
- د کارولو سره د آډیو او ویډیو کنټرولونو ملاتړ کوي او ټګونه
- د آفلاین ډیټا ذخیره کولو لپاره د SQL ډیټابیس او غوښتنلیک کیچ کاروي.
- جاواسکریپټ ته اجازه ورکوي چې د JS ویب ورکر API کارولو سره په شالید کې کار وکړي.
- ویکتور ګرافیک د HTML5 بنسټیز برخه ده، د SVG او کینوس په څیر.
- د ډریګ او ډراپ اغیزو ته اجازه ورکوي.
- دا ممکنه کړئ چې شکلونه رسم کړئ.
- د ټولو نوي براوزرونو ملاتړ کوي لکه فایرفاکس، موزیلا، کروم، او سفاري.
- ډیر ګرځنده دوستانه.
- د ډاکټایپ اعالمیه ساده او اسانه ده.
- د ویب جوړښتونو لپاره نوي عناصر لري لکه nav، header، او footer، د نورو په منځ کې، او همدارنګه د charset، async، او ping ځانګړتیاوې لري.
- د کرکټر کوډ کول ساده او اسانه کوي.
- د JS GeoLocation API په کارولو سره د کارونکي جیو لوکیشن تعقیبولو ته اجازه ورکوي.
- د ناسم ترکیب اداره کولو وړتیا.
برسیره پردې، د HTML ډیری عناصر شتون لري چې یا هم د HTML5 څخه بدل شوي یا لیرې شوي. پدې کې شامل دي:
- - ته بدل شو
- - ته بدل شو
- - ته بدل شو
- - لرې شوی
- - لرې شوی
- - لرې شوی
- - کومه نوې نښه نشته. CSS کاروي.
- - کومه نوې نښه نشته. CSS کاروي.
- - کومه نوې نښه نشته. CSS کاروي.
- - کومه نوې نښه نشته. CSS کاروي.
- - کومه نوې نښه نشته. CSS کاروي.
په ورته وخت کې، HTML5 کې یو شمیر نوي اضافه شوي عناصر هم شامل دي. پدې کې شامل دي:
- nav
- غږیز
- figcaption
- پرمختګ
- د قوماندې
- وخت
- ډاټا لیست
- ویډیو
- شميره
- متر
- معلومات
- برخه
- وخت
- اسيد
- ترخيمې
- لنډیز
- rp
- rt
- تفصيل
- wbr
- سرۍ
- پښۍ
- keygen
- ایډز
- مقاله
- hgroup
- bdi
- نښه
- محصول
- سرچينه
- روان
- برخه
- ياقوتو
د HTML5 مثالونه (د لوبې ډګر کوډ)
د سیمانټیک جوړښت مثالونه
In HTML5 ځینې سیمانټیک عناصر شتون لري چې د ویب پاڼې مختلف برخو تعریف کولو لپاره کارول کیدی شي. دلته ترټولو عام دي:
سرلیک
<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>
برخه
<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 فارمیټ کولو شیټ شیټ لاسي او ما یو داسې ډیزاین کړی چې کولی شي تاسو سره د لارې په هر ګام کې مرسته وکړي.
CSS څه شی دی؟
د کاسکیډینګ سټایل شیټونه یا CSS تشریح کوي چې څنګه د HTML عناصر به په سکرین کې ښکاره شي. ځکه چې دا کولی شي په ورته وخت کې د ډیری مخونو ترتیب کنټرول کړي، دا کولی شي تاسو ډیر وخت او هڅې خوندي کړي.
CSS د ویب پاڼو د پریزنټشن د بیانولو ژبه ده، په شمول رنګونه، ترتیب، او فونټونه. دا یو چا ته اجازه ورکوي چې پریزنټشن مختلف ډوله وسیلو ته تطبیق کړي ، لکه لوی سکرینونه ، کوچني سکرینونه ، یا پرنټرونه. – له W3.org څخه
د HTML او CSS ترمنځ توپیر څه دی؟
پداسې حال کې چې HTML او CSS دواړه ژبې دي چې د ویب پاڼو او غوښتنلیکونو جوړولو لپاره کارول کیږي، دوی مختلف دندې لري.
HTML هغه څه دي چې تاسو یې د جوړښت او مینځپانګې حکم کولو لپاره کاروئ چې په ویب پاڼه کې به ښودل شي.
CSS، له بلې خوا، د بدلون لپاره کارول کیږي د ويبپاڼي د طراحي په ویب پاڼه کې د HTML عناصرو (په شمول د ترتیب، بصری اغیزو، او شالید رنګ).
HTML جوړښت او مینځپانګه رامینځته کوي ، CSS ډیزاین یا سټایل کوي. په ګډه، HTML او CSS د ویب پاڼې انٹرفیس جوړوي.
د CSS نحو څه شی دی؟
د سی ایس ایس ترکیب د انتخاب کونکي او د اعلان بلاک څخه جوړ شوی دی.
انتخاب کونکی د HTML عنصر ټاکي چې سټایل شي پداسې حال کې چې د اعلامیې بلاک یو یا څو اعلامیې یا جوړه د CSS د ملکیت نوم او د دوی ترمینځ د کولون سره ارزښت لري.
اعالمیه د سیمیکولونونو په واسطه جلا کیږي او د اعلامیې بلاکونه تل په منحل قوسونو کې تړل کیږي.
د مثال په توګه، که تاسو غواړئ هغه طریقه بدله کړئ چې ستاسو سرلیک 1 ښکاري، ستاسو د CSS ترکیب به د دې په څیر ښکاري: h1 {color:red; د فونټ اندازه: 16pc؛}
د CSS چیټ شیټ بشپړ کړئ
CSS د کارولو لپاره خورا اسانه دی. ننګونه دا ده چې ډیری انتخاب کونکي او اعلانونه شتون لري چې د ټولو یادول که ناممکن نه وي ستونزمن دي. که څه هم تاسو اړتیا نلرئ دوی یاد کړئ.
دلته یو دی د CSS او CSS3 لپاره د غلا پاڼه چې تاسو هر وخت کارولی شئ.
پی ایچ پی څه شی دی؟
PHP د Hypertext Preprocessor لنډیز دی، یوه مشهوره پرانیستې سرچینه، د HTML- ایمبیډ شوي سکریپټینګ ژبه چې د متحرک ویب پاڼو، ویب غوښتنلیکونو، یا جامد ویب پاڼو پراختیا لپاره کارول کیږي.
څرنګه چې پی ایچ پی د سرور اړخ ژبه ده، د دې سکریپټونه په سرور کې اجرا شوي (نه په براوزر کې) ، او د دې محصول په براوزر کې یو ساده HTML دی.
PHP په پراخه کچه کارول شوې خلاصې سرچینې عمومي هدف سکریپټینګ ژبه ده چې په ځانګړي توګه د ویب پراختیا لپاره مناسبه ده او په HTML کې ځای په ځای کیدی شي. – د PHP.net څخه
دا د سرور اړخ سکریپټینګ ژبه په مختلف عملیاتي سیسټمونو کې چلیږي ، پشمول وینډوز ، ماک OS ، لینکس او یونیکس. دا د ډیری سرورونو لکه اپاچي او IIS سره هم مطابقت لري.
د نورو ژبو لکه ASP او JSP په پرتله، PHP د پیل کونکو لپاره زده کول اسانه دي. PHP هم ډیری ځانګړتیاوې وړاندې کوي چې د پرمختللي کچې پراختیا کونکي ورته اړتیا لري.
د PHP او HTML ترمنځ توپیر څه دی؟
که څه هم دواړه ژبې د دې لپاره خورا مهم دي ګورت پرمختګ، PHP او HTML په څو لارو کې توپیر لري.
کلیدي توپیر په دې کې دی چې دوه ژبې د څه لپاره کارول کیږي.
HTML د مراجعینو اړخ لپاره کارول کیږي (یا مخکینۍ پای) پراختیا، پداسې حال کې چې پی ایچ پی د سرور اړخ لپاره کارول کیږي پرمختیا.
HTML هغه ژبه ده چې پرمخ وړونکي په ویب پاڼه کې د منځپانګې تنظیم کولو لپاره کاروي، لکه د متن، انځورونو، میزونو، او هایپر لینکونو داخلول، د متن بڼه کول، او د رنګونو مشخص کول.
په ورته وخت کې ، PHP د ډیټابیس څخه ډیټا ذخیره کولو او ترلاسه کولو ، منطقي عملیاتو ترسره کولو ، بریښنالیکونو ته لیږلو او ځواب ورکولو ، فایلونو اپلوډ او ډاونلوډ کولو ، ډیسټاپ غوښتنلیکونو رامینځته کولو او نور ډیر څه لپاره کارول کیږي.
د کوډ ډول له مخې، HTML جامد دی پداسې حال کې چې PHP متحرک دی. د HTML کوډ هرکله چې پرانیستل کیږي تل ورته وي، پداسې حال کې چې د PHP پایلې د کارونکي براوزر پورې اړه لري.
د نوي پرمخ وړونکو لپاره، دواړه ژبې زده کول اسانه دي، که څه هم د زده کړې وکر د PHP په پرتله د HTML سره لنډ دی.
د PHP چیټ شیټ بشپړ کړئ
که تاسو یو نوی پروګرامر یاست چې غواړئ په PHP کې ډیر ماهر اوسئ یا د دې په اړه خپله پوهه پراخه کړئ، دلته یو دی د پی ایچ پی د فریب پاڼه تاسو کولی شئ په چټکۍ سره مراجعه وکړئ.
دا چټ شیټ د PHP افعال څخه جوړ دی - کوم چې د پراخه کارول شوي کوډونو لپاره شارټ کټونه دي - کوم چې د سکریپټینګ ژبه کې جوړ شوي.
د پی ایچ پی چیټ شیټ ډاونلوډ کړئ
حتمي HTML، CSS او PHP چیټ شیټ
که تاسو یو تجربه لرونکی پراختیا کونکی یاست یا یوازې یو څوک چې کوډ کول پیل کوي ، دا خورا ښه دی چې یو څه ولرئ چې تاسو تل د حوالې لپاره بیرته راشئ یا په ساده ډول خپل حافظه تازه کړئ.
او پراختیا کونکو ته د ډالۍ په توګه څوک چې تر مینځ جنګ کوي HTML، CSS، او PHP، دلته د الټیمیټ چیټ شیټ دید هر هغه څه سره بشپړ کړئ چې تاسو ورته اړتیا لرئ د دې دریو کوډینګ ژبو په اړه پوه شئ او یاد وساتئ:
ګډ HTML، CSS او PHP چیټ شیټ ډاونلوډ کړئ