فێربىوًی زهاًی HTMLبە کىردی
ًوىوًەیەکی سادە لە کۆدی HTML ( HTMLئێچ تی ئێن ئێڵ یاى هتوڵ) کە کىرتکراوەی Markup Language HyperTextـە زهاًێکی پیطاًذاًی پەڕەکاًی سەر وێبە کە بەکاردێت بۆ ًىوسیٌی هەر پەڕەیەک لەسەر وێب .پەڕگەی HTMLتەًها پێکهاتىوە لە دەق ،کە ئەویص پێکهاتىوە لە کۆهەڵێکی زۆر لە تاگ و تىخن و ًىوسراوی ًاو پەڕەکە .ئەم تاگاًە بە وێبگەڕ دەڵێي کە چۆى ًىوسیي و وێٌەکاى یاى ًاوەڕۆکی پەڕەکە دەربکەوێت. HTMLزۆر ئاساًە بۆ فێربىوى بە ڕادەیەک کە کەسێکی دوور لە ئایتی ئەتىاًێت لە هاوەیەکی کەهذا فێری HTMLببێت و بیٌىوسێت و دەستکاری بکات .ئەواًەی کە HTMLدەًىوسي پێیاى ًاوترێت پڕۆگراهٌىوش ( )Programmerبەڵکى ًىوسەر ( )Authorلەبەرئەوەی کە زهاًێکی پڕۆگراهیي ًییە بەڵکى زهاًێکی پیطاًذاًە و لە هاوپۆلی Javaو Cو ASIC ًییە.
ًاوەڕۆک
١هاًایHTML ٢تىاًایHTML ٣چین پێىیستە بۆ فێربىوى؟ ٤پاضگری htmیاى html؟ ً ٥ىوسیي و پاضەکەوتکردى ٦تاگەکاى ٧تىخوەکاى ٨تایبەتوەًذییەکاى ٩پێکهاتەی پەڕەیHTML DTD١١ ١١تاگ/تایبەتوەًذی/تىخن ـە بێ بایەخەکاى
١٢پەرەگراف– Paragraph ١٣سەردێڕ– Heading ١٤بەستەر - Link ١٤.١ oتىخوی بەستەر ١٤.٢ oکردًەوە لە ضىێٌێکی دیاریکراو ١٤.٣ oبەستەر بۆ دەقێک لە هەهاى پەڕەدا ١٥وێٌە – Image ١٥.١ oتایبەتوەًذیsrc ١٥.٢ oتایبەتوەًذییەکاًی altوtitle ١٥.٣ oتایبەتوەًذییەکاًی HeightوWidth ١٦لیست – List ١٦.١ oلیستی ڕیسکراو- Ordered List ١٦.٢ oلیستی ڕیسًەکراو- Unordered List ١٦.٣ oلیستی پێٌاسە– Definition List ١٧خطتە - Table ١٧.١ oتایبەتوەًذییەکاًی خطتە ١٨فۆرم - Form ١٨.١ oتێکردى- input ١٨.٢ oڕووبەري دەق- textarea Drop Down١٨.٣ o div ١٩وspan ٢١تىخوەکاًی ًێى head ٢١.١ oتىخویmeta ٢١.٢ oتىخویlink XHTML٢١ ٢٢جیاوازی ًێىاى HTMLوXHTML
هاًای HTML
HyperTextهەبەست لەوەیە کە تۆ بە ًاو وێبذا دەگەڕێیت لە هەر کاتێکذا و بۆ هەر ضىێٌێک کە بتەوێت بە کرتەکردى لەو بەستەراًەی لە الپەڕەکاًذا دەیاًبیٌیت ًەک بە ضێىەیەکی ڕێک و یەک لە دوای یەک. Markupبریتییە لە کاری تاگەکاى لەسەر ًىوسراوی ًاو پەڕەکە وەک (تۆخکردى ،الرکردى ،هێڵبەژێرداهێٌاى، )...ـی هەر دەقێک. Languageواتە زهاى HTML .زهاًە وەک هەهىو زهاًە جیاوازەکاًی تر چىًکە کۆد و ڕستەکاری هەیە.
تىاًای HTML HTMLبۆ دروستکردًی هاڵپەڕێکی سادە و تاکەکەسی دەست ئەدات یاى بۆ هەر جۆرە هاڵپەڕێک کە ًىێکردًەوەی زۆر ًەبێت .ئەتىاًرێت بە CSSـەوە بلکێٌرێت بۆ پێذاًی ضێىازێکی جىاًتر و ئاساًتر لە ڕێکخستٌیذا .بە پێچەواًەوە HTMLبۆ هاڵپەڕێکی بسۆک ،فراواى و بازرگاًی دەست ًادات کە ڕۆژاًە ًىێ دەکرێتەوە چىًکە HTMLزهاًێکی جێگیرە .داڕضتي و ًىێکردًەوەی ئەو هاڵپەڕە گەوراًەی کە بە HTMLدەًىوسرێي کارێکی زۆر گراى و کاتبەرە.
چین پێىیستە بۆ فێربىوى؟ بۆ فێربىوًی HTMLتەًها پێىیستت بە دەستکاریکەرێک (بۆ ًىوسیٌی کۆدەکاى) و وێبگەڕێک (بۆ بیٌیٌی ئەًجام) دەبێت .هیچ ئاهڕازێکی تر یاى ًەرهەکااڵیەکت پێىیست ًابێت .دەستکاریکەر لە ویٌذۆز وەک Notepadکە سادەتریي دەستکاریکەری دەقە ،بەاڵم ئەواًەی کە ئاهۆژگاریکراوى وەک:
++Notepad VIM Gedit Medit Bluefish
وێبگەڕیص وەک:
Firefox Opera Google Chrome Internet Explorer
هەرچەًذە چەًذ پڕۆگراهێک هەى بۆ دەستکاریکردى و داڕضتٌی پەڕگەیەکی HTMLلەواًە Microsoft ,DreamWeaver Microsoft Web Expression ,FrontPageئەم پڕۆگراهاًە WYSIWYGـي ،خۆیاى کۆدەکاًت بۆ دەًىوسي و تۆ ڕووە ئەًجاهەکەی دەبیٌیت .ضارەزابىوى لەم پڕۆگراهاًە هاًای ضارەزابىوى ًییە لە ،HTMLبەڵکى یاریذەدەرێکي بۆ ئەو کەساًەی کە دەیاًەوێت هاڵپەڕێکیاى هەبێت و لە هیچ زهاًێکی وێبذاڕضتي ًازاًي یاى بۆ چەًذ کارێکی کەهیاى پێىیستە و لەبەرئەوە ًایاًەوێت کاتێک تەرخاى بکەى بۆ فێربىوًی زهاًێک.
پاضگری htmیاى html؟ بەکارهێٌاًی هەر کاهێک لە پاضگری htm.یاى html.بە گطتی وەک یەک واى و دروستي .لە سەرەتاوە کە سیستەهە کۆًەک اى تەًها ڕێگەیاى بە سێ ًىوسە ئەدا بۆ پاضگری پەڕگە ،بەو ضێىەیە بىو ،بەاڵم دوای ئەوەی ڕێگەدرا ًىوسەی زیاتر بەکارببرێت پاضگری html.ـیص پەیذا بىو .لە ئێستادا ًىوسیٌی هەر کاهێکیاى وەک پاضگر ئەکەوێتە سەر ئارەزووی ًىوسەر و هیچ کەضەیەک دروست ًاکەى .کەواتە yekemin-perre.html = yekemin-pere.htm
ًىوسیي و پاضەکەوتکردى
پاضەکەوتکردى بە utf-8لە Notepad لە سەرەتادا ئەوەی دەتەوێت لە دەستکاریکەرەکەدا دەیٌىوسیت پاضاى بچۆ بۆ File > Save asلە جێیەک پاضەکەوتی بکە بە هەر ًاوێکەوە بەاڵم ئەوەی گرًگە بە پاضگری htmlپاضەکەوتی بکەیت ،بۆ ًوىوًەyekemin-perre.html :
خاڵێکی گرًگ پێص پاضەکەوتکردًی پەڕگەکە گۆڕیٌی Encodingـی پەڕگەیەکە بۆ یىًیکۆد .چۆًییەتی گۆڕیٌیص لە دەستکاریکەرێکەوە بۆ دەستکاریکەرێکی تر جیاوازە .لە Notepad++دەبێت بچیت بۆ Format > Encode in UTF-8 without BOMبەاڵم لە Notepadلە کاتی پاضەکەوتکردى و کردًەوەی پەًجەرەی پاضەکەوتکردًذا دەتىاًیت پەڕگەکە بکەیت بە utf-8بەوەی کە لە ژێر ًىوسیٌی ًاوە پەڕەکەدا.
تاگەکاى HTMLلە ڕێی تاگەکاًەوە ضێىازی دەرکەوتي و ًىوسیي لە پەڕەکەدا ڕێک دەخات .ئەو دەقەی دەهاًەوێت گۆڕاًکارییەکی بەسەردا بهێٌیي لە (تۆخکردى ،الرکردى ،کردى بە پەرەگراف و بەستەر) دەیکەیٌە ًێىاى دوو تاگەوە .تاگەکاًیص پێکهاتىوى لە دوو کەواًەی تیژی داخراو کە لە ًێى کەواًەکاًذا پیتێک یاى وضەیەک دەًىوسرێت تا دەقی دیاریکراو گۆڕاًکاری ویسیترای بەسەردابێت .وە لە تاگی دووەهذا هێڵێکی الر ( )/دادەًرێت کە هەبەست لێی داخستٌەوەی تىخوەکە و کۆتایی هێٌاًە بەو ضێىازی دەرکەوتٌە .بۆ ًوىوًە گەر بواًەوێت دەقێک بە ضێىازێکی تۆخ بٌىوسیي ،بەم ضێىەیە دەبێت: ></strongئەم نووسراوە تۆخە><strong
بەاڵم ژهارەیەکی کەم لە تىخوەکاى پێکهاتىوى لە یەکێک و تاگی داخستٌەوەیاى ًییە وەک تاگی چىوًەسەر دێڕی ًىێ یاى تاگی وێٌە: ><img src="http://www.domain.com/wene.jpg" /
تێبیٌی :لێرەدا دەبیٌیت پێص کەواًەی کۆتایی هێڵێکی الر داًراوە ئەهەش ئەوە ئەگەیەًێت کە داًاًی وێٌە لە یەک تاگ پێکهاتىوە و تاگەکە خۆی خۆی دائەخاتەوە .ئەضتىاًرێت ئەو هێڵێ الرە ًەًىوسرێت بەاڵم لە وەضاًی ٤.١١ـەوە وا ئاهۆژگاریکراوە کە بٌىوسرێت و تاوەکى لەگەڵ بٌەهاکاًی XHTMLـیطذا بگىوًجێت.
تىخوی HTMLپێکذێت لە (تاگی سەرەتا ،تایبەتوەًذیً ،اوەڕۆکی تىخن ،تاگی کۆتایی)
تىخوەکاى تىخوەکاى لە تاگی سەرەتاوە دەستپێذەکەى هەتا تاگی کۆتایی کە لە ًاویاًذا لەواًەیە ًاوەڕۆک و/یاى تایبەتوەًذی هەبي. هەًذێک لە تىخوەکاى بێ ًاوەڕۆکي وەک تىخوی وێٌە .دەضێت هەًذێک لە تىخوەکاى سەرەڕای ًاوەڕۆک تایبەتوەًذیطیاى ًەبێت کە بەهاًەش دەوترێت تىخوە بەتاڵەکاى ،وەک تىخوی چىوًەسەر دێڕی ًىێ و تىخوی هێڵی ئاسۆیی (کە تەًها لە تاگێکی تاک پێکهاتىوى). ><br / ><hr /
تایبەتوەًذییەکاى تایبەتوەًذییەکاى کە پێک هاتىوى لە ًاوی تایبەتوەًذیی و ًرخی تایبەتوەًذی بە ضێىەی "taybetmendiدەًىوسرێي و دەکەوًە ًێى تاگی سەرەتای هەر تىخوێکەوە ئەم تایبەتوەًذییاًە زاًیاریی زیاتر لەسەر تىخوەکە دابیي دەکەى ،کاریگەرییاى لەسەر جێ دەهێڵي یاى تىخوەکاى دیاری دەکەى تا بەهۆی CSSـەوە کاریگەرییاى بەسەردا بهێٌرێي .هەًذێک ًوىوًە:
nawi-taybetmendi="nirxi-
تایبەتوەًذی altلە تىخوی وێٌەدا کە بە واتای دەقی جێگرەوە دێت ( )text alternativeبە کاردێت بۆ ًىوسیٌی دەقێک تا پیطاى بذرێي لەو وێبگەڕاًەی پاڵپطتی پیطاًذاًی وێٌە ًاکەى یاى بەکارهێٌەر پیطاًذاًی وێٌەی ًاچاالک کردووە.
<img src="http://chawg.org/img/opensuse.png" alt="OpenSUSE leser computeri >Dell mini 9" /
تایبەتوەًذی styleکە بە ضێىەی inline CSSدەتىاًیت کاریگەرییەک بهێٌیت بەسەر ًاوەڕۆکی تىخوەکەدا. ><p style="color:#ff0000;">Eme deqeke ke be rengi sur nusrawe.</p
بە هۆی classو idـیەوە دەتىاًیت دەقێک دیاری بکەیت تا بە هۆی ستایڵ ضیتەوە گۆڕاًکارییەکیاى بەسەردا بهێٌیت. ><div class="nawnishan">Min feri HTML debim.</div
تێبیٌیً :رخی تایبەتوەًذییەکاى دەبێت لە ًێىاى تاک یاى جىوت کۆتەیطٌذا بٌىوسرێي لە ،XHTMLبەاڵم لە HTML دەکرێت بە بێ کۆتەیطٌیص بٌىوسرێي.
پێکهاتەی پەڕەی HTML HTMLبە ضێىەیەکی سادە پێکهاتىوە لە سێ بەضی سەرەکی (بەضی ،DOCTYPEبەضی ،headبەضی )bodyسادەتریي پەڕگەیەک کە بە ً HTMLىوسرابێت بەم ضێىەیەیە: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN >""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ><html ><head ><title>Ferbuni HTML</title ></head ><body ><p>Yekem babet le ferbuni HTML.</p ></body ></html
دێڕی یەکەم کە پێی دەوترێت Document Type Definitionبریتییە لە ًاساًذًی پەڕەکە کە ئاهاژە بە جۆری ئەو بەڵگەًاهەیە ئەکات کە سەر بە چ جۆرێکی HTMLـە .پێىیستە لە دێڕی یەکەم لە سەرەتای هەهىو کۆدەکاًذا
بێت. هەردوو تاگی کردًەوە و داخستٌی htmlلە سەرەتا و کۆتایی هەهىو کۆدەکاى دەًىوسرێي .ئەم تاگە بە وێبگەڕ دەڵێت کە ئەم پەڕەیە HTMLـە. هەردوو تاگی headـیص لە دوای تاگی htmlـەوە دێت .هەرچی لە ًێىاى ئەم دوو تاگەدا دەًىوسرێي لە ًێى پەڕەکەدا دەرًاکەوى بەڵکى لە ًێىاى ئەم دوو تاگەدا تەًها زاًیاری دەربارەی ئەو پەڕەیە تیادا دەًىوسرێت. تاگەکاًی ً titleاوًیطاًی پەڕەکە دیاری دەکەى ،هەرچی لە ًێىاى ئەو دوو تاگەدا بٌىوسرێي دواتر لە Title barـی وێبگەڕ دەردەکەوێت .بۆ ًوىوًە گەر ئەو پارچە کۆدەی سەرەوە لە پەڕگەیەکذا بٌىوسیي ،دواتر کە بە وێبگەڕێک ئەو پەرگەیەهاى کردەوە دەبیٌیت لە ً Title barىوسراوە .Ferbuni HTML لە ًێىاى تاگەکاًی bodyـذا ئەوە دەًىوسیي کە دەهاًەوێت لە ًێى پەڕەکەدا دەربکەوێت ،وەک دیارە لە سەرەوە لە ًێىاى تاگی پەرەگرافذا ًىوسیىهاًە "."Yekem babet le ferbuni HTML
DTD Document Type Definitionکە لە سەرەتای هەهىو کۆدەکاًذا دێت سێ جۆری هەیە:
XHTML 4 Strictوەضاًێکی داهاڵڕاوی HTMLـە لەو تایبەتوەًذییاًەی کە لە وەضاًی چىاری HTMLـذا ًەهاوى و لە بایەخیاى کەهکراوًەتەوە
ئەم جۆرە بەکارببە گەر ئەتەوێت بۆ دەرکەوتي و ڕووخساری هاڵپەڕەکەت بە تەواوی پەیىەست بیت بە CSSـەوە و ًاتەوێت سىود لە تاگە بێ بایەخەکاى وەربگریت DTD .بۆ XHTML 1.0 Strictبەم ضێىەیەیە: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 strict//EN >""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
XHTML 4 Transitionalبەرباڵوتریي جۆریاًە کە ًىوسەر دەتىاًێت سەرەڕای CSSـیص تاگە بێ بایەخەکاى بەکار ببات.
ئەم جۆرە بەکارببە گەر ئەتەوێت بۆ دەرکەوتي و ڕووخساری هاڵپەڕەکەت سىود لە هەردوو CSSو تاگەبێ بایەخەکاى وەربگریت DTD .بۆ XHTML 1.0 Transitionalبەم ضێىەیەیە: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN >""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
XHTML 4 FRAMESETوەک هەهاى جۆری Transitionalـە لەم جۆرەدا تاگی framesetجێگەی تاگی bodyدەگرێتەوە.
ئەم جۆرە بەکارببە گەر دەتەوێت پەڕەکە دابەش بکەیت بۆ سەر چەًذ چىارچێىەیەک DTD .بۆ XHTML 1.0 FRAMESET
بەم ضێىەیەیە: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN >""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
تاگ/تایبەتوەًذی/تىخن ـە بێ بایەخەکاى ئەو تاگ/تایبەتوەًذی/تىخن ـاًەى کە لە HTML 4.01ـەوە ًەهاوى لەبەر بێ بایەخییاى یاى لەبەر تىاًیٌی ئەًجاهذاًی هەهاى کاریگەری بە هۆی CSSـەوە .لە جێگەیاى تاگی ًىێتر داًراوى .کە تا ئێستا وێبگەڕەکاى پطتگیری ئەو تاگاًە ئەکەى ،بەاڵم لە داهاتىودا لەواًەیە بە تەواوەتی ًەهێٌي و هیچ کاریگەرییەکی پیطاًذاًیاى ًەهێٌێت لەسەر پەڕەکاى .بۆیە وا باضترە بەراًبەرەکاًیاى بەکارببرێي .هەًذێک لەواًە:
البردًی تىخوی fontالبرا بە هۆی بىوًی font-size, font-family, colorلە .CSS تایبەتوەًذی alignکە بۆ ًاوەًذکردى یاى کردًە الی ڕاست و چەپی دەقێک بەکاردێتً .رخەکاًی right, center, left, justifyـە لە بری ئەوە دەبێت text-alignلە ستایڵ ضیت بەکار ببرێت. تىخوی uبۆ هێڵبەژێرداهێٌاى لە ستایڵ ضیت ;text-decoration:underlineئەو کارە دەکات.
تاگی appletکە بۆ کارپێکردًی پڕۆگراهۆکەکاًی جاڤا بىو گۆڕدرا بە .object
پەرەگراف – Paragraph تىخوی pبەکاردێت بۆ دیاریکردًی دەقێک وەک پەرەگراف و ًاوەڕۆکی تىخن وەک پەرەگراف دەًاسێٌێت .لەبەر ئەوەی ئەم تىخوە کاریگەرییەکی دیاری ًییە لەسەر دەق ،هەًذێک لە ًىوسەراى بیریاى ئەچێت ئەم تىخوە بەکاربەرى بۆ پەرەگراف یاى تاگی کۆتایی دابخەىً .وىوًە: ><p>Em deqe peregirafe boye le new tuxmi p nusrawe.</p <p>Min etwanim bichme ser helli nwe u chend derreki tir l peregirafekem binusim u le >kotayida tagi kotayi dabixemewe</p لەم پەرەگرافەدا ئەتوامن بە پیتی عەرەبی >"<p class="sereki" dir="rtl ></pبنووسم
لە ًوىوًە سێیەهذا دوو تایبەتوەًذیواى داوەتە تىخوەکە ،تایبەتوەًذی classـواى داوەتێ و ًاساًذووهاًە بە serekiتا بە ستایڵ ضیت گۆڕاًکاری بەسەردا بهێٌیي ،وەک گۆڕیٌی ڕەًگ ،قەبارە ،فۆًت … ،ـی پەرەگرافەکە .تایبەتوەًذی دووەهیص بۆ ئاڕاستەی ًىوسیٌواى گۆڕیىە بە لە ڕاستەوە بۆ چەپ.
سەردێڕ – Heading سەردێڕ لە ٦تىخن پێک هاتىوە ( )h1, h2, h3, h4, h5, h6بەکاردێت بۆ ًىوسیٌی سەردێڕً/اوًیطاًی بابەت یاى پەڕەیەک چىًکە کاتێک وێبگەڕ ئەم تىخوە دەبیٌێت هەڵذەستێت بە تۆخکردى و گەورەکردًی قەبارەی ًاوەڕۆکی تىخن واتە بێ CSSو هیچ تایبەتوەًذییەک h1 .گەورەتریي و h6بچىکتریٌیاًە. ><h1>Mallperri Chawg</h1 ><h2 class="nawnishan">Ferbuni HTML</h2
ًوىوًە :١هەردوو تىخوی سەردێڕ و پەرەگراف لە پەڕەیەکذا: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN >""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ><html ><head ><title>Ferbuni HTML le mallperri chawg</title ></head ><body
><h1>Mallperri Chawg</h1 ><h2 class="nawnishan">Ferbuni HTML</h2 ><h3>Waney yekem</h3 <p>Serderr le 6 tuxim pekhatun h1 gewretiriniyane u h6 bichuktiriniyane, bekardet bo nusini nawnishani babet u perre. Tuxmekani header gorrankari toxi u gewreyi >qebare edat be nawerroki tuxim.</p ></body ></html
ئەم کۆدەی سەرەوە لە دەستکاریکەرێکذا بٌىوسە و بە وێبگەڕ پەڕەکە بکەرەوە تا ئەًجاهەکەی ببیٌیت .بیٌىوسە! ڕووًىوسی هەکە تا فێربیت!
بەستەر Link - تىخوی بەستەر گرًگتریي و زۆرتریي تىخوی بەکاربراوە کە بریتییە لە بە ًاوًیطاًکردًی دەقێک کە بە کرتەکردى لێی بەکارهێٌەر ڕەواًە دەکرێت بۆ ئەو ًاوًیطاًەی تیایذا ًىوسراوە .بە ضێىەیەکی سادە تىخوەکە بریتییە لە: ><a href="http://www.chawg.org/wiki/chawg">Chawg</a
تىخوی ( aلەًگەر )anchor/بەکاردێت بۆ دروستکردًی بەستەر.
ًاوی تایبەتوەًذی hrefواتە ( )Hypertext referenceدەبێت ًرخەکەی ًاوًیطاًی ئەو بەستەر ( )URLـە بێت کە دەتەوێت بەکارهێٌەری بۆ ڕەواًە بکەیت .بەستەر دروست ًابێت بە بێ تایبەتوەًذی href ًاوەڕۆکی تىخن ئەو دەقە دەبێت کە وەک بەستەر دەردەکەوێت کە لێرەدا " "Chawg Mallperriـە.
کردًەوە لە ضىێٌێکی دیاریکراو گرًگتریي تایبەتوەًذی لە پاش hrefتایبەتوەًذی targetـە کە بەکاردێت بۆ پێذاًی ضىێٌێکی دیاریکراو بۆ کراًەوەی بەستەر تیایذا وەک کراًەوە لە پەًجەرەیەکی ًىێذا یاى لە چىارچێىەیەک لە هەهاى پەڕە و پەًجەرەدا (کاتێک پەڕەکە دابەضکرابێت بۆ چەًذ چىارچێىەیەک)
کردًەوە لە پەڕەیەکی ًىێذا:
><a target="_blank" href="http://www.chawg.org">Chawg</a
کردًەوە لە چىارچێىەیەکذا: ><a target="rightframe" href="http://www.chawg.org">Chawg</a
ً rightframeاوی ئەو چىارچێىەیە دەبێت کە لە پەڕەکەدا هەیە.
بەستەر بۆ دەقێک لە هەهاى پەڕەدا چىارچێىەیەک لە سەرەوە دەبیٌیت ًىوسراوە "ًاوەڕۆک" بە کرتەکردى لە هەر بەستەرێکی ًاو چىارچێىەکە دەگەیتە ضىێٌێک لە هەهاى ئەم پەڕەیەدا .ئەهە بریتییە لە بەستەرکردى بۆ دەقێک کە لە هەهاى پەڕەی بەستەرەکەدا هەیە .بۆ ًوىوًە هي دەًىوسن "بۆ خىێٌذًەوە لەسەر DTDکرتە لێرە بکە" دەهەوێت بیکەهە بەستەر و ڕەواًەی ئەو دەقەی سەرەوەی بکەم کە بەم ضێىەیە دەبێت:
ئەبێت ًاوًیطاًێک بذەم بەو دەقەی ئەهەوێت بەستەری بۆ بکرێت: ><a name="DTD">DTD</a
ئەهە کۆدی ئەو ًىوسراوەیە کە لە سەرەوە ًىوسراوە ئەویص بە پێذاًی تایبەتوەًذی .nameوضەی DTDـی ًرخی تایبەتوەًذییەکەشً ،اوًیطاًەکەیە (ً DTDاوەڕۆکی تىخن ًا).
بەستەر بەم ضێىەیە دەًىوسرێت: ></aکرتە لێرە بکە DTDبۆ خوێندنەوە لەسەر>"<a href="#DTD
وێٌە – Image تىخوی وێٌە یەکێکە لەو تىخواًەی کە لە تاگێک پێکهاتىوە و خۆی خۆی دائەخاتەوە .تىخوەکە پێکهاتىوە لە: ><img src="http://domain.com/image.png" /
تایبەتوەًذی src
تایبەتوەًذی srcتایبەتوەًذی بٌەڕەتی تىخوی وێٌەیەً .رخی تایبەتوەًذی پێىیستە ڕێڕەو ( )pathـی وێٌەکە بێت .ئەگەر بىخچەیەکواى هەبێت بە ًاوی mywebلە ًاویذا دوو بىخچەی تر بە ًاوەکاًی filesو ئەوی تر .imagesلەًاو بىخچەی filesـیطذا بىخچەیەکی ترهاى هەبێت بە ًاوی .thumbsبەم ضێىەیە: /wene1.jpg /myweb/wene2.jpg /myweb/files/perre.html /myweb/files/thumbs/wene3.jpg /myweb/images/wene4.jpg
گەر پێکهاتە پەڕگەکاًواى وەک ئەوەی سەرەوە بێت و بواًەوێت لە perre.htmlـەوە بەستەر بکەیي بۆ .wene3.jpgدەبێت بەم ضێىەیە ڕێڕەوەکە بٌىوسیي: ><img src="thumbs/wene3.jpg" /
بەاڵم ئەگەر بواًەوێت بەستەر بکەیي بۆ ،wene2.jpgبەم ضێىەیە دەبێت: ><img src="../wene2.jpg" /
لەبەر ئەوەی پەڕگەکە لە بىخچەی filesـذایە وێٌەکە و لە بىخچەی mywebـذایە کە بىخچەیەک سەرووترە بۆیە دەبێت دوو خاڵ دابٌێیي لەپێطی .ئەگەر وێٌەکە دوو بىخچە سەرووتر بىو وەک وێٌەی ،wene1.jpgئەوە دوو جار خاڵەکاى دا دەًێیي ،وەک: ><img src="../../wene1.jpg" /
وە بەستەر بۆ wene4.jpgبەم ضێىەیە دەبێت: ><img src="../images/wene4.jpg" /
دەضتىاًیي لە ڕێڕەوی بەستەرەکە ًاوًیطاًێکی تەواوەتی بٌىوسیي ،وەک:
><img src="http://domain.com/uploads/images/wene5.jpg" /
تایبەتوەًذییەکاًی titleو altـی تىخوی وێٌە
تایبەتوەًذییەکاًی altو title تایبەتوەًذییەکاًی altو titleدوو تایبەتوەًذی ًسیکي لەیەکەوە .هەهیطە بەکارهێٌەر لێی تێک دەچێت کە کاهیاى بەکار ببات لە تىخوەکەدا .تایبەتوەًذی altکە چیتر بىوەتە تایبەتوەًذییەکی گرًگ و پێىیست .پیطاى دەدرێت ،کاتێک وێبگەڕ پاڵپطتی پیطاًذاًی وێٌە ًاکات یاى بەکارهێٌەر وای کردووە کە وێٌە پیطاى ًەدرێت .ئەویص بریتییە لە چەًذ وضەیەکی کەم وەک دەقێکی جێگرەوە بۆ وێٌەکە تا بەکارهێٌەر لە ًاوەڕۆکی وێٌەکە تێ بگات. >" /فێربوونی هتمل"=<img src="http://domain.org/ferbunihtml.png" alt
بەاڵم تایبەتوەًذی titleتایبەتوەًذییەکی جیایە لە ً .altرخی تایبەتوەًذی titleکاتێک پیطاى دەدرێت کە بەکارهێٌەر ًیطاًذەری هطکەکە دەباتە سەر وێٌەکە .دەتىاًیت هەردوو تایبەتوەًذییەکە لە هەهاى تىخوی وێٌەدا دابٌێیت ،بەاڵم ضارەزایاى وا ئاهۆژگاری دەکەى کە تایبەتوەًذی altبەکارببرێت بۆ هەهىو وێٌەیەک و تایبەتوەًذی titleـیص کاتێک بەکارببرێت کە وێٌە بەستەر بێت بۆ الپەڕەیەک و لە ًرخی تایبەتوەًذی ً titleاوًیطاًی پەرە بەستەربۆکراوەکە بٌىوسیي. >"<a href="http://www.chawg.org/wiki/index.php?title=HTML فێربوونی "=<img src="http://chawg.org/images/html_wiki_chawg.png" alt >" /></aفێربوونی زمانی هتمل بە کوردی"=" titleهتمل
تێبیٌی :لەم ًوىوًەیەی سەرەوە تىخوی وێٌە بىوەتە ًاوەڕۆکی تىخوی بەستەر کە لێرەدا وێٌەکە دەبێتە بەستەر.
تایبەتوەًذییەکاًی Heightو Width
هەردوو تایبەتوەًذی heightو widthـیص بەرزی و پاًی وێٌەکە دیاری دەکەى کە دەتىاًیت قەبارەی وێٌەکەی پێ زیاد یاى کەم بکەیت .دیاریکردًی پاًی و بەرزی وێٌەکاى دەبٌە هۆی تێک ًەچىوًی layoutـی پەرەکە کاتێک پەڕەکە خەریکە دەکرێتەوە و وێٌەکاى بەتەواوی ً loadەبىوىً .وىوًەیەک کە هەهىو تایبەتوەًذییەکاًی لەخۆ گرتىوە: "فێربوونی هتمل"=<img src="http://domain.org/ferbunihtml.png" alt >" height="100" width="140"/فێبوونی زمانی هتمل بەکوردی"=title
لیست – List
جۆرەکاًی لیستی HTML لە HTMLـذا سێ جۆر لیستواى هەیە .یەکەم ،لیستی ڕیسکراو .دووەم ،لیستی ڕیسًەکراو .سێیەم ،لیستی پێٌاسە.
لیستی ڕیسکراو Ordered List - لەم لیستەدا داًەکاًی لیست بە ژهارە یاخىد پیت ڕێکذەخرێي تىخوی olبەکاردەبرێت بۆ دیاریکردًی ئەم جۆرە لیستە. داًەکاًی هەردوو لیستی ڕیسکراو و ڕیسًەکراو دەخرێٌە ًێى تىخوی liـیەوەً .وىوًە: >"<ol type="a ></liڕیسکراوی <li>١ ></liڕیسکراوی <li>٢ ></liڕیسکراوی <li>٣ ></ol
دەتىاًیي چەًذ ًرخێک بۆ typeدابٌێیي .لەواًە aبۆ ڕیسکردى بە پیتی بچىک A ،بۆ پیت گەورە I ،بۆ ڕیسکردًی ڕۆهاًی گەورە و iـیص بۆ بچىک .تایبەتوەًذی startبەکاردێت بۆ دیاریکردًی دەستپێکردًی لیستەکە لە ژهارەیەکەوەً .رخی تایبەتوەًذی هەهیطە دەبێت ژهارەی ئیٌگلیسی بێت ئەگەر چیص جۆری ڕیسکردًەکە پیت یاى ژهارەی ڕۆهاًی بێت ،وەک: >"<ol type="a" start="4 ></liڕیسکراوی <li>١ ></liڕیسکراوی <li>٢ ></liڕیسکراوی <li>٣ ></ol
لێرەدا ڕیسکردًەکە لە پیتی Dـیەوە دەستپێذەکات هەتاوەکى .Eهەڵەیە ئەگەر بٌىوسیي
"start="d
لیستی ڕیسًەکراو Unordered List - لەم لیستەدا داًەکاى ڕیسًەکراوى و لە پێص هەر داًەیەک خاڵێک ،بازًەیەک یاى دیسکێک دادەًرێت .تىخوی ul
بەکاردەبرێت بۆ دیاریکردًی لیستەکەً .وىوًە:
></liڕیسنەکراوی ></liڕیسنەکراوی ></liڕیسنەکراوی ></liڕیسنەکراوی
><ul <li>١ <li>٢ <li>٣ <li>٤ ></ul
تایبەتوەًذی typeلە لیستی ڕیسًەکراودا بەکاردێت بۆ دیاریکردًی ئەوەی کە چ هێوایەک لە پێص داًەکاًی لیستەکەدا بێت. ًوىوًە: >"<ul type="circle ></liڕیسنەکراوی <li>١ ></liڕیسنەکراوی <li>٢ ></ul
تێبیٌی :هەردوو تایبەتوەًذی typeو startلە تایبەتوەًذییە البراوەکاًي.
لیستی پێٌاسە – Definition List
ئەم لیستە پێکذێت لە دەستەواژەیەک و پێٌاسەکەی .دەستەواژە دەکرێتە ًێى تىخوی dtـیەوە و پێٌاسەی دەستەواژەکەش لە دوای ئەو دێت لە ًێى تىخوی ddـذا .هەردووکیطیاى پێکەوە دەکرێٌە ًێى تىخوی dlـەوەdefinition Term, dd = = dt . Definition Description, dl = Definition List ًوىوًە: ><dl ></dtنەورۆز><dt >.</ddیەکەمین مانگی ساڵی کوردییە><dd ></dtسەگ><dt >.</ddگیاندارێکی بەوەفایە><dd ></dl
خطتە Table - تاگ و تىخوەکاى لە پێکهێٌاًی تىخوی سەرەکی خطتە کەهێک چڕترى وەک لە تىخوەکاًی تر ،بەاڵم پاش تێگەیطتٌی دەبیٌیي هیچ ئاڵۆزییەکی تیادا ًییە. > ></tdخانەی ،١ ></tdخانەی ،٢ ></tdخانەی ،٣
"<table border="1 ><tr ڕیسی <td>١ ڕیسی <td>١ ڕیسی <td>١ ></tr ><tr
></tdخانەی ،١ڕیسی <td>٢ ></tdخانەی ،٢ڕیسی <td>٢ ></tdخانەی ،٣ڕیسی <td>٢ ></tr ><tr ></tdخانەی ،١ڕیسی <td>٣ ></tdخانەی ،٢ڕیسی <td>٣ ></tdخانەی ،٣ڕیسی <td>٣ ></tr ><table
ًوىوًەکەی سەرەوە خطتەیەکی ٩خاًەیی دروست دەکات ،پێک هاتىوە لە ٣ستىوى و ٣ئاسۆ .کە ئەم تىخواًەی تیا دەبیٌیي:
تىخوی :tableتىخوی سەرەکییە لە پێکهێٌاًی خطتەکە. تىخوی :trواتە هەر ئاسۆیەکی خطتەکە ( )Row Tableکە بەکاردێت بۆ پێکهێٌاًی هەر دێڕێک یاى ئاسۆیەک لە خطتەکە .ئەم تىخواًە بریتیي لە ًاوەڕۆکی تىخوی ( tableدەکەوًە ًێى تىخوی tableـەوە). تىخوی :tdواتە هەر تاکە خاًەیەک ( )Data Tableکە بەضذاری دەکەى لە پێکهێٌاًی سەراپای خطتەکە .ئەم تىخواًە بریتیي لە ًاوەڕۆکی تىخوی ( trدەکەوًە ًێى تىخوی trـەوە).
تێبیٌی:
تایبەتوەًذی borderپێىیستە بٌىوسرێت تا چىارچێىەی خطتەکە دیاری بکات. هەًذێک جار وا پێىیست دەکات ئاسۆی یەکەهی خطتە وەک سەردێڕ لێ بکەیت .ئەهەش ئەًجام دەدرێت بە داًاًی تىخوی thلە بری tdـیەکاى .کە کاریگەری تۆخکردى و ًاوەًذکردى دەداتە دەقی ًێى خاًەکە .وەک لە ًوىوًەی داهاتىودا بەکاربراوە.
تایبەتوەًذییەکاًی خطتە زۆریٌەی ئەو تایبەتوەًذییاًەی پاڵپطتی لە تىخوەکاًی خطتە ئەکەى ،لە بێ بایەخەکاًي یاى چیتر لە وەضاًە ًىێیەکاًی HTML ـذا ً Validیي .لەواًەش وەک .bgcolor, nowrap, Align ,height :تایبەتوەًذییە گرًگەکاًی خطتە ئەهاًەى (کە لەو پارچە کۆدەی خىارەوە هەهىویاى بەکاربراوى):
تایبەتوەًذی :borderبۆ دیاریکردًی قەبارەی سٌىورەکاًی خطتەکە.
تایبەتوەًذی :widthبۆ دیاریکردًی قەبارەی خطتە و خاًەکاى. تایبەتوەًذی :cell-paddingبۆ دوورخستٌەوە ًىوسراوی ًێى خاًەکاى لە لێىاری خاًەکاًی خطتەکە .ئەگەر ئەم تایبەتوەًذییە ًەًىسرێت بە ضەوەیەکی بٌەڕەت ًرخەکەی بە ١خاڵ (پیکسڵ) دادەًرێت تایبەتوەًذی :cell-spacingبۆ کەهکردى و زیادکردًی بۆضایی ًێىاى لێىاری خاًەکاى .بۆ دوورخستٌەوە ًىوسراوی ًێى خاًەکاى لە لێىاری خاًەکاًی خطتەکە .ئەگەر ئەم تایبەتوەًذییە ًەًىسرێت بە ضەوەیەکی بٌەڕەت ًرخەکەی بە ٢خاڵ (پیکسڵ) دادەًرێت. تایبەتوەًذی :colspanبەکار دێت بۆ درێژکردًەوەی خاًەیەکی ئاسۆیی بەدرێژایی چەًذ خاًەیەکی دیاریکراوی ستىوًی. تایبەتوەًذی :rowspanبەکار دێت بۆ درێژکردًەوەی خاًەیەکی ستىوًی بەدرێژایی چەًذ خاًەیەکی دیاریکراوی ئاسۆیی.
>"<table border="1" width="800" cellpadding="3" cellspacing="0 ><tr ></thخانەی ١و ،٢ڕیسی <th colspan="2">١ ></thخانەی ،٣ڕیسی <th>١ ></tr
><tr ></tdخانەی ،١ڕیسی ١و <td rowspan="2">٣ ></tdخانەی ،٢ڕیسی <td width="15%">٢ ></tdخانەی ،٣ڕیسی <td>٢ ></tr ><tr ></tdخانەی ،٢ڕیسی <td>٣ ></tdخانەی ،٣ڕیسی <td>٣ ></tr ><table
دوو تایبەتوەًذی تریص هەى ،ئەواًیص rulesو .frameتایبەتوەًذی rulesبەکاردێت بۆ ضاردًەوە و بەدیارخستٌی هێڵەکاًی ًێىاى خاًەکاى کە ئەم ًرخاًە وەردەگرێت .none ,all ,cols ,rows :تایبەتوەًذی frameـیص بۆ هێڵەکاًی چىارچێىەی خطتەکە ،ئەم تایبەتوەًییاًە وەردەگرێت.border ,vsides ,hsides ,rhs ,lhs ,below ,above : ً .viod ,boxوىوًە: >"rules="all" frame="hsides
<table ><tr
></tdخانەی ،١ڕیسی <td>١ ></tdخانەی ،٢ڕیسی <td>١ ></tdخانەی ،٣ڕیسی <td>١ ></tr ><tr ></tdخانەی ،١ڕیسی <td>٢ ></tdخانەی ،٢ڕیسی <td>٢ ></tdخانەی ،٣ڕیسی <td>٢ ></tr ><table
تێبیٌی :کاریگەرییەکاًی وەک گۆڕیٌی قەبارە ،جۆر و ڕەًگی فۆًت ،خطتە و خاًەکاى دەبێت بە CSSئەًجام بذرێي.
فۆرم Form - فۆڕم بەکاردێت بۆ داغڵکردى و ًاردًی زاًیاری لەالیەى بەکارهێٌەرەوە ،وەک فۆڕهی پەیىەًذی ،فۆڕهی چىوًەژوورەوە... لەًاو فۆڕهذا ،تىخوەکاًی فۆڕم دەًىوسیي ،کە ئەواًیص ...select ,input ,textareaـي.
>"<form action="contact.php" method="get ></form
فۆرڕم لە HTMLـذا ًاکارایە و تەًها پیطاًذاًە ،بۆیە پێىیستواى بە زهاًێکی بسۆک دەبێت بۆ کارپێکردًی فۆڕهەکە .وەک لەسەرەوە دەبیٌیت تایبەتوەًذی actionفۆڕهەکەی پەیىەست کردووە بە زهاًە بسۆکەکەوە .تایبەتوەًذی methodـیص کە هەردوو ًرخی getو postـی هەیە post ،بۆ ضاردًەوە و getبۆ پیطاًذاًی زاًیارییەکاى بەکاردێت لە URLـذا.
تێکردى input - inputزۆرتریي تاگی بەکاربراوی تىخوی فۆڕهە .کە دەتىاًیي بەپێی ًرخی تایبەتوەًذیی typeجۆری ئەو فۆڕهەکەی دیاری بکەیيً .رخەکاًی تایبەتوەًذیی typeکە جۆری فۆڕهەکە دیاری دەکەى ،ئەهاًەى,file ,password ,text : image ,hidden ,button ,reset ,submit ,radio ,checkbox چۆًێتی بەکارهێٌاًیاى (کۆدەکە لە پەڕگەیەکذا ڕووًىوش بکە تا دەرەًجاهەکاًیاى ببیٌیت): ><input type="text" name="username" /><br / ><input type="password" name="pass" /><br / ><input type="file" name="uploader" /><br / ><input type="submit" name="submitbtn" value="Send" / ><input type="reset" name="resetfields" value="Clean Fields" /><br / ><input type="checkbox" checked="checked" name="remembermechbx" /><br / ><input type="radio" name="radiobtn" value="Male" / ><input type="radio" name="radiobtn" value="Female" /><br / ><input type="button" name="custombtn" value="A Custom Button" /><br / "<input type="image" name="img" value="sent" src="images/send.png >alt="Send (image button)" /><br / ><input type="hidden" name="hiddenfld" value="usr955" /
- textخاًەیەکی تاک هێڵییە بەکاردێت لەکاتی داغڵکردًی ًاو ،تێپەڕەوضە ،ئیوەیل...
- passwordبەهەهاى ضێىەی textبەاڵم لەکاتی ًىوسیٌی تێپەڕەوضەدا بەکاردێت تا وضەکاى بطاردرێٌەوە. - fileبۆ بارکردًی پەڕگەیەک لە کۆهپیىتەری بەکارهێٌەرەوە ،وەک لە uploaderـەکاًذا. - submitدوگوەیەکە لە فۆڕهەکەدا بەکاردێت لە ًاردًی زاًیارییەکاًی ًێى فۆڕهەکە. - resetبەکاردێت بۆ بەتاڵکردًەوەی ئەو زاًیارییاًەی بەکارهێٌەر لەًێى فۆڕهەکەدا ًىوسیىیەتی. - checkboxبەکاردێت لە هەڵبژاردًذا .کاتێک چەًذ هەڵبژاردًێک دیاری کراوە و بەکارهێٌەر دەتىاًێ زیاد لە داًەیەک هەڵبژێرێت.
- radioبەکاردێت لە هەڵبژاردًذا .کاتێک چەًذ هەڵبژاردًێک دیاری کراوە و بەکارهێٌەر دەتىاًێ تەًها یەکێک هەڵبژێرێت. - buttonدوگوەیەکە ،بەاڵم ئەم زاًیاری ًێى فۆڕهەکە ًاًێرێت بۆ ڕاژە ،بەڵکى پێىسیتە بە سکریپتێکی وەک جاڤاسکریپتەوە ببەسرێتەوە بۆ کارپێکردًی ڕاستەوخۆی سکریپتەکە. - imageدوگوەیەکی ًاردًە وەک submitبەاڵم بە وێٌە. - hiddenخاًەیەکی ضاراوەیە کە بەکارهێٌەر ًایبیٌێت .بەزۆری بەکاردێت کاتێک فۆڕم لە چەًذ پەڕەیەک پێکهاتىوە و پێىیستە زاًیارییەکاًی پەڕەی یەکەم پاضەکەوتبکرێي و هەڵبگیرێي بۆ پەڕەکاًی تر.
بۆ ًوىوًە لە دروستکردًی فۆڕهێکی چىوًەژوورەوە ،بەم ضێىەیە فۆڕم بەکاردەهێٌیي: >"<form action="login.php" method="post >Username: <input type="text" name="username" /><br / >Password: <input type="password" name="password" /><br / "<input type="checkbox" name="rememberchkbox" value="autologin />Automatically log me in every time I visit. ><br / ><input type="submit" name="submitit" value="Submit Data" / ></form
ڕووبەري دەق textarea - textareaخاًەیەکی گەورەیە بۆ ًىوسیٌی دەقێکی زۆر بەکاردێت .بە پێچەواًەی تىخوی inputـەوە textarea ،تاگی سەرەتا و کۆتایی هەیە .وە پێىستە تایبەتوەًذییەکاًی rowsو colsبٌىوسیت بۆ دیاریکردًی بەرزی و پاًی خاًەکە. <textarea name="postfield" rows="10" cols="50">Deqeket lere >binuse</textarea
هەردوو تایبەتوەًذیی readonlyو disabledبەکاردێت بۆ ًاچاالککردًی خاًەکە و ًەهێطتٌی دەستکاریکردًی لەالیەى بەکارهێٌەرەوە .وەک ئەم ًوىوًەیە: "<textarea name="postfield" rows="10" cols="50 >readonly="readonly">Natiwanit destkari em deqe bikeyt</textarea
Drop Down
بەاڵم بەcheckbox وradio وەک، لیستێکە لە کۆهەڵێک هەڵبژاردى بۆ دیاریکردًی داًەیەک یاى زیاترDrop Down .ضێىەیەکی کۆکراوە بەم.option لە ًێى لیستەکەضذا بۆ هەر هەڵبژاردًێک تىخوی، بەکاردەهێٌیي بۆ دروستکردًی لیستەکەselect تىخوی :ضێىەیە <select name="dropdownlist"> <option value="ku">Kurd</option> <option value="en">English</option> <option value="fr">French</option> </select>
هەروەها." بەکاردێت بۆ دیاریکردًی زیاد لە هەڵبژاردًێک لە لیستەکەmultiple="multiple تایبەتوەًذی .یص بۆ ًاچاالککردًی لیستەکەdisable تایبەتوەًذی : بەم ضێىەیە.optgroup دەتىاًیي هەڵبژاردًەکاى بکەیٌە دەستە دەستە بە بەکارهێٌاًی تاگی
<select name="countrieslist"> <optgroup label="Middle East"> <option value="ir">Iran</option> <option value="iq">Iraq</option> <option value="jo">Jordan</option> <option value="sa">KSA</option> </optgroup> <optgroup label="Europe"> <option value="es">Spain</option> <option value="fr">France</option> <option value="de">Germany</option> <option value="it">Italy</option> </optgroup> <optgroup label="Asia"> <option value="jp">Japan</option> <option value="cn">China</option> <option value="in">India</option> <option value="id">Indonesia</option> </optgroup> </select>
span وdiv
divو spanبەکاردێي وەک لە پۆلپۆلکردًی کۆهەڵێک دەق و کاریگەری پێذاًیاى بەهۆی .CSSتاگی divوەک پەرەگراف کاتێک دەدرێت بە دەقێک ،هێڵێک پێص خۆی و هێڵێک پاش خۆی جێ دەهێڵێت بەاڵم spanلەًێى هێڵذا. تایبەهەًذییەکاًیاى بریتیي لە style ,id ,class ًوىوًە: >"<div class="honrawenus Qani' nawi Mihemmed Kabuliye. le salli 1905 le gundi shiler ledayk buwe u salli 1965 be nexoshimirduwe. pallpishti chini cutiyar u hejaran buwe her boye nasrawe be sha'iri chewsawekani Kurdistan ></div
بەاڵم :span ><p>Kotiri <span style="color:#ffffff">sipi</span> hemay ashtiye.</p <p>Zanisteki <span style="font-weight:bold;">dirisht</span> u <span >style="text-decoration:underline;">kirawe</span>.</p
واتە کاتێک spanبەکاردێٌیي ،ئەگەر بواًەوێت کاریگەری بذەیٌە وضەیەک یاى چەًذ وضەیەکی ًێى دێڕێک.
تىخوەکاًی ًێى head تىخوەکاًی ًێى headکۆهەڵێک تىخوي لەًێى تاگی ><head></headداى .ئەم تىخواًە بەکارهێٌەر ًایاى بیٌێت بەاڵم کاریگەری گرًگیاى هەیە لەسەر پەڕەکە و وێبگەڕ و بسوێٌەرەکاًی گەڕاى سىود لەم تىخواًە وەردەگرى.
تىخوی meta تىخوی metaبەکاردێت بۆ پێذاًی زاًیاری لەسەر جۆرً ،ىوسەر ،پەسي و وضەکلیل...
بەکارهێٌاًی تایبەتوەًذیی http-equivو content
><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
تایبەتوەًذی http-equivبەکاردێت لە بىژاًذًەوە ()refreshی پەڕەکە یاى ڕێکخستٌی کاضکردى .لە تایبەتوەًذی contentیص چارسێت/ئیٌکۆدیٌی پەڕەکە دیاری دەکات .ئەو دێڕەی سەرەوە لە هەهىو پەڕەیەکی ئاساییذا بەکار دەبرێت. ضێىەیەکی تر ئەگەر بواًەوێت پەڕەکە refreshبکات چەًذ چرکە جارێک یاى ئاڕاستەی بکەیي بۆ پەڕەیەکی تر ًرخی
تایبەتوەًذی http-equivدەگۆڕیي بۆ refreshو ًرخی contentیص بۆ ژهارەی چرکەکاى لەگەڵ ًاوًیطاًی بەستەرەکە .بۆ ًوىًە: <meta http-equiv="refresh" content="60" /> <!-- 60 chirke carek perreke >refresh ekat-- <meta http-equiv="refresh" content="10;http://chawg.org/meko" /> <!-- le >diway 10 chirke perreke arraste dekret bo besteri chawg.org/meko--
بەکارهێٌاًی تایبەتوەًذی وضەکلیل و پەسي
وضەکلیل ( )keywordsبەکاردێت بۆ ًاساًذًی هاڵپەڕەکەت لە چەًذ وضەیەکذا کە بە کۆها لێک جیاکراوًەتەوە ،پەسٌیص ( )descriptionبە هەهاى ضێىە بۆ ًاساًذًی هاڵپەڕ یاى پەڕەیەک لە هاڵپەڕەکە بەکاردێت لە ڕستەیەکذا .بەم ضێىەیە لەًێى headدا دەًىوسرێي: وێبداڕشنت ,هتمڵ بە name="keywords" content="chawg, mallperri chawg, >" /کوردی ,سی ئێش ئێش بە کوردی ,پی ئێچ پی بە چاوگ ماڵپەڕێکی ئایتییە ،گرنگی بە "=name="description" content >" /بوارەکانی سەچاوەکراوە و وێبداڕشنت
<meta کوردی <meta دەدات
پێطتر بسوێٌەرەکاًی گەڕاى ئەم دوو تایبەتوەًذییەیاى بەکاردەهێٌا بۆ ڕیسکردًی هاڵپەڕەکاى لە ئەًجاهی گەڕاًەکاًیاًذا .کاتێک بەکارهێٌەرێک بۆ وضەیەک دەگەڕا بسوێٌەرەکاى ئەو هاڵپەڕاًەیاى دادەًا بە ئەًجاهی گەڕاى کە وضەکەی تیادابىو ،بەاڵم لەبەر خراپ بەکارهێٌاًی ئەو دوو تایبەتوەًذییە ،ئەهڕۆ زۆربەی بسوێٌەری گەڕاًەکاى فەراهۆضیاى کردووى .خراپ بەکارهێٌاى واتا ًىوسیٌی وضەیەک لە وضەکلیل و پەسٌذا کە هاڵپەڕەکەت تایبەت ًەبێت پێی یاى ًىوسیٌی دەیاى وضە بۆ بۆ زۆرکردًی هەلی دەرکەوتٌی هاڵپەڕەکەت لە بسوێٌەرەکاًی گەڕاًذا کە ئەهەش کاریگەری ًەرێٌی دەبێت و دەبێتە هۆی ئەوەی هاڵپەڕێک لە گەڕاًەکاًذا دەربکەوێت کە هیچ پەیىەًذی بەو بابەتەوە ًەبێت کە بەکارهێٌەر بۆی گەڕاوە.
تىخوی link بەکاردێت بۆ بەستٌەوە و تێهەڵکێطکردًی پەڕگەیەک بە پەڕە HTMLـەکەوە ،وەک تێهەڵکێطکردًی CSSو .Favicon
تێهەڵکێطکردًی ڕووخسار
تێهەڵکێطکردًی Favicon
"<link rel="stylesheet" type="text/css >href="http://www.mallperr.com/ruxsar.css" /
><link rel="Shortcut Icon" type="image/ico" href="PATH/TO/favicon.ico" /
XHTML eXtensible HyperText Markup Languageداڕضتٌەوەی هەهاى HTMLـە بە پابەًذبىوى بە بٌەهاکاًی XML
ـەوە کە دواتر بىوە بە پەسەًذکراوی .W3C
جیاوازی ًێىاى HTMLو XHTML ئەو جیاوازیاًەی لە ًێىاى HTMLو XHTMLـذا هەیە ئەوەیە کە ئەبێت بەڵگەًاهەکاًی XHTMLبە درووستی لەسەر ڕێساکاًی ً XMLىوسرابي ،ئەواًیص لەهاًەدا خۆی دەگرێتەوە:
هەهىو تاگ و تىخوەکاى داخرابٌەوە .ئەو تاگاًەی تاگی کردًەوە و داخستٌەوەیاى هەیە پێىیستە هەردووکیاى بىوًیاى هەبێت ،بۆ ًوىوًە:
ًادروست: <h1>Eme headere<h2>Emesh headereki tir
دروست: ><h1>Eme headere</h1><h2>Emesh headereki tir</h2
تاگە تاکەکاى دابخرێٌەوە .وەک پێطتر وتواى هەًذێک لە تاگەکاى تاکي و تاگی داخستٌەوەیاى ًییە ،بۆیە پێىیستە تاگەکە لە ًاو خۆیذا خۆی دابخاتەوە.
ًادروست: ><br
دروست: ><br /
پاش و پێص ًەخستٌی تاگەکاى .گەر چەًذ تاگێک بە دوای یەکذا هاتي ،ئەو تاگەی یەکەم جار دەکرێتەوە لە کۆتایی هەهىو تاگەکاًی تر دابخرێتەوە.
ًاردوست:
<strong><em>blod and italic</strong></em>
:دروست <strong><em>blod and italic</em></strong>
) پێىیستە هەهىو تاگ وcase-sensitive( هەستیارە بەراًبەر پیتی گەورە و بچىکXML لەو کاتەوەی کە .تىخوەکاى بە پیتی بچىک بٌىوسرێي
:ًادروست <STRONG>em deqe toxe</STRONG>
:دروست <strong>em deqe toxe</strong>
.)' ـێکذا بٌىوسرێي ("جىوت" یاى 'تاکquotation ًرخی هەهىو تایبەتوەًذییەکاى پێىیستە لە ًێىاى
:ًادروست <p id=peregiraf>Eme peregirafe</p>
:دروست <p id="peregiraf">Eme peregirafe</p>
.ًىوسیٌی هەردوو ًرخ و تایبەتوەًذییەکاى
:ًادروست <input type="checkbox" checked></input>
:دروست <input type="checkbox" checked="checked"></input>
.2.1 GNU Free Documentation License ًاوەڕۆک ئاهادەیە لە ژێر
وەرگیراوە لە سایتی www.chawg.org : چاک کردى :ساهڕەًذ حاجی