Sida loo Dhigayo Qoraallada Dhexdhexaadin Sawir

Eeg bog kasta oo bog ah waxaadna arki doontaa isku-dar ah qoraalka iyo sawirada. Labada qaybood ee ka mid ah qodobadani waa waxyaabaha muhiimka ah ee guusha website-ka. Macluumaadka qoraalka waa waxa booqdayaasha goobta soo akhrin doono iyo matoorada raadinta ayaa u adeegsan doona qayb ka mid ah darajadooda algorithms. Sawiradu waxay ku dari doonaan xiisaha muuqaalka goobta waxayna ka caawineysaa inay ku muujiyaan qoraalka.

Ku darista qoraalka iyo sawirrada shabakadaha waa sahlan. Qoraalka waxaa lagu darayaa jumladaha caadiga ah ee HTML sida jumladaha, cinwaanada, iyo liisaska, halka sawirrada la geliyay bog leh 'img> element. Si kastaba ha noqotee, waxaad ku aragtay muuqaalka boggaaga bogga, si kastaba ha ahaatee, waxaa laga yaabaa inaad rabto in aad haysato qoraalka ku xiga sawirka, halkii aad ka hoos mari lahayd hoosta (taas oo ah habka ugu habboon ee sawirada lagu daro koodhka HTML wuxuu ku siin doonaa shabakada). Farsamo ahaan, waxaa jira laba siyaabood oo aad ku heli kartid muuqaalkan, adiga oo isticmaalaya CSS (lagu taliyay) ama adigoo ku dhejinaya tilmaamaha muuqaalka tooska ah ee HTML (laguma talinayo, maadaama aad rabto inaad sii wadato kala-takoorka qaabka iyo dhismahaaga boggaaga).

Isticmaalka CSS

Habka saxda ah ee loo baddalayo habka bogga iyo qaabka sawirada iyo sida qaabkoodu u muuqdaan muuqaalka shabakada waa CSS . Kaliya xusuusnow, maadaama aan ka hadleyno isbeddel muuqaal ah oo ku saabsan bogga (sameynta qoraalka ku wareegsan sawir), tani macnaheedu waa inay tahay aagga Cascading Style Sheets.

1. Marka hore, ku dar sawirkaaga bogga internetka. Xasuuso inaad ka saarto astaamaha muuqaalka (sida qiimaha width iyo height) HTML. Tani waa muhiim, gaar ahaan websaydh jawaab leh halka cabbirka sawirku uu kala duwanaan doono iyadoo ku xiran browser-ka. Qaar ka mid ah software-ka, sida Adobe Dreamweaver, waxay ku dari doonaan macluumaadka ballaaran iyo dhererka muuqaallada la geliyay qalabkan, markaa hubso inaad ka saarto macluumaadkan ka soo horjeedka HTML! Ha hubina, si kastaba ha ahaatee, inaad ku darto qoraalka ku habboon . Halkan waxaa ku qoran tusaale ahaan qaabka aad HTML u eegi karto:
2. Ujeedooyinka qaabeynta, waxaad sidoo kale ku dari kartaa fasalka sawir. Qiimaha fasalkan waa waxa aan ku adeegsan doonno faylka CSS. Ogow in qiimaha aan halkan u isticmaalno ay tahay mid aan ikhtiyaar aheyn, inkastoo, qaabkani gaar ahaaneed, waxaan u muuqannaa inaan isticmaalno qiimaha "bidix" ama "sax", iyadoo ku xiran habka aan rabno sawirkayagu waafaqsanahay. Waxaannu aragnaa in qoraalka fudud uu si fiican u shaqeyn karo oo uu u fududaan karo kuwa kale kuwaas oo laga yaabo in ay maamulaan goob mustaqbalka ah si ay u fahmaan, laakiin waxaad siin kartaa qiime kasta oo aad rabto.
   2. Kaligiis, qiimaha fasalku waxba ma qaban doono. Sawirka si toos ah looma dhajin doono bidixda qoraalka. Tani, waxaan hadda u baahannahay inaan u leexano faylka CSS.

1. Qoraalkaaga, waxaad hadda ku dari kartaa qaabka soo socda:
   1. .bidix {
   2. float: bidix;
   3. caarada: 0 20px 20px 0;
   4. }
   5. Waxa aad halkan ku samaysay waxay isticmaalaysaa qalabka CSS "float" , taas oo sawir ka qaadi doonta dukumiintiga caadiga ah (qaabka sawirku sida caadiga ah u muujin doono, qoraalka la dhigo ee hoosta ku yaal), oo waxay u habaynaysaa dhinaca bidix ee weelkiisa . Qoraalka soo socda ka dib imtixaanka HTML iyada oo hadda ku duuban. Waxaan sidoo kale ku daray qaar ka mid ah qiimaha boodhka ah si aan qoraalkan aan si toos ah looga soo horjeedo image. Taa bedelkeeda, waxay yeelan doontaa meelo fiican oo u muuqda inay muuqaal ahaan soo jiidan doonaan naqshadda bogga. In CSS shorthand loogu talagalay cidhibtirka, waxaan ku daray 0 qiimaha dhinaca sare iyo bidix ee image, iyo 20 pixels in ay bidix iyo hoos. Xasuuso, waxaad u baahan tahay inaad ku darto qaar ka mid ah garaynta midigta dhinaca midig ee muuqaalka bidix ee la socda. Sawir sax ah oo loo siman yahay (oo aan eegayno daqiiqad) ayaa lahaan lahaa midabeyn dhinaca bidixda.
2. Haddii aad boggaaga internetka ku aragto biraawsarka, waa inaad hadda aragtaa in sawirkaagu uu la socdo dhinaca bidix ee bogga iyo qoraalka si qurux badan u duubaya. Siyaabo kale oo lagu sheego tani waa in sawirku "loo rogo dhinaca bidix".

1. Haddii aad rabto inaad bedesho muuqaalkan si sax ah u jaangooyo (sida sawirka sawirka ee raacaya maqaalkan), waxay noqon laheyd mid fudud. Marka hore, waa in aad hubsatid in, marka lagu daro qaabka aynu ku darsannay CSS-gaaga qiimaha fasalka "bidix", waxaan sidoo kale leenahay mid loogu talagalay saxsanaanta. Waxay u egtahay sidan:
   1. .right {
   2. float: xaq;
   3. ciriiri: 0 0 20px 20px;
   4. }
   5. Waxaad arki kartaa in tani ay ku dhowdahay midka ugu horreeya CSS ee aan ku qornay. Kala duwanaanshaha kaliya ayaa ah qiimaha aan u isticmaalno guriga "float" iyo qiimaha korontada aan isticmaalno (ku dar qaar ka mid ah dhinaca bidix ee muuqaalkeena halkii midig).
2. Ugu dambeyntii, waxaad bedeli doontaa qiimaha fasalka sawirka "bidix" ilaa "sax" HTML:
3. Halkaan ka eeg boggaaga gawaarida hadda iyo muuqaalkaaga waa in uu la midoobaa midigta leh qoraalka si qumman u duubaya hareeraha. Waxaan u muuqannahay inaan ku darno qaababkaas midkood, "bidix" iyo "sax" dhammaan qaababka noocyadeena ah si aan u isticmaali karnaa qaababka muuqaalka ah marka loo baahdo markaan abuureyno bogag internet ah. Labadan qaab waxay noqdaan kuwo wanaagsan, dib loo isticmaali karo oo aan u jeedsan karno mar kasta oo aan u baahanno inaan sawirro muuqaal ah ku qoro qoraallo ku wareegsan.

Isticmaalka HTML halkii aad ka heli laheyd CSS (iyo Maxaad U Baahan Tahay Sidan Tani)

Inkasta oo ay suurtagal tahay in la sameeyo qoraalka ku wareegsan sawir leh HTML, heerarka webku waxay ku qeexaan in CSS (iyo tallaabooyinka la soo bandhigay) ay tahay habka aad u socon karto si aan u sii wadno kala soocida qaabka (HTML) iyo style (CSS). Tani waxay si gaar ah muhiim u tahay markaad tixgeliso, qalabyada qaarkood iyo qaababka, qoraalkaasi uma baahna inuu u wareego sawirka. Sawirro yaryar, qaabeynta website-ka wax ku ool ah ayaa laga yaabaa inay u baahan tahay in qoraalka runtii ka dhigo mid ka hooseeya sawirka iyo in sawirku uu fidiyo ballaadhka buuxa ee shaashadda. Tani si sahlan ayaa loo sameeyaa iyada oo waraaqaha warbaahineed haddii qaababkaaga ay ka duwan yihiin astaamaha HTML. Meelaha ay ka muuqato adduunka maanta, sawirada iyo qoraalka ayaa si gooni ah u arki doona booqdayaasha kala duwan iyo shaashado kala duwan, kala-tashadaan waxay lagama maarmaan u tahay guusha muddada-dheer iyo maareynta bogga internetka.