Bi o ṣe le Fi ọrọ kun Pipa Pipa

Wo eyikeyi oju-iwe ayelujara ati pe iwọ yoo ri apapo awọn akoonu ọrọ ati awọn aworan. Awọn ẹda meji ti awọn eroja wọnyi jẹ awọn eroja pataki ni aṣeyọri aaye ayelujara kan. Ọrọ akoonu jẹ ohun ti alejo ojula yoo ka ati ohun ti awọn àwárí enjini yoo lo bi ara ti wọn ranking algorithms. Awọn aworan yoo ṣe afikun ifunwo ojulowo si aaye naa ati iranlọwọ lati ṣe afihan akoonu akoonu.

Fifi ọrọ ati awọn aworan kun si awọn aaye ayelujara jẹ rọrun. A fi ọrọ kun pẹlu awọn afi HTML ti o yẹ gẹgẹbi paragira, awọn akọle, ati awọn akojọ, nigba ti awọn aworan ti wa ni oju-iwe pẹlu element. Lọgan ti o ba fi kun aworan kan si oju-iwe ayelujara rẹ, sibẹsibẹ, o le fẹ lati ni sisanwọle ti o wa lẹhin aworan naa, dipo ki o tẹ si isalẹ (eyi ti ọna aiyipada ni aworan ti o fi kun si koodu HTML yoo ṣe ni ẹrọ lilọ kiri ayelujara). Ni imọiran, awọn ọna meji ni o le ṣe aṣeyọri yi, boya nipa lilo CSS (niyanju) tabi nipa fifi awọn itọnisọna ojuhan si taara sinu HTML (ko ṣe iṣeduro, niwon o fẹ lati ṣetọju iyapa ti ara ati ọna fun aaye ayelujara rẹ).

Lilo CSS

Ọna ti o tọ lati yi ọna kikọ oju-iwe kan ati ifilelẹ aworan pada ati bi awọn aza ti wọn wa han ni aṣàwákiri jẹ pẹlu CSS . Jọwọ ranti, niwon a n sọrọ nipa ayipada wiwo kan lori oju-iwe (ṣiṣe ṣiṣọrọ ọrọ ni ayika aworan kan), eyi tumọ si pe o jẹ ifilelẹ Awọn iwe-paṣipaarọ Style.

  1. Akọkọ, fi aworan kun si oju-iwe ayelujara rẹ. Ranti lati ṣe ifamọra eyikeyi awọn abuda wiwo (bii iwọn ati awọn iwo giga) lati HTML. Eyi jẹ pataki, paapaa fun aaye ayelujara idahun nibiti iwọn aworan yoo yato si da lori aṣàwákiri. Awọn software, bi Adobe Dreamweaver, yoo fi iwọn ati alaye giga si awọn aworan ti a fi sii pẹlu ọpa naa, nitorina rii daju lati yọ alaye yii kuro ni koodu HTML! Ma ṣe daju, sibẹsibẹ, lati ni ọrọ alt alt yẹ . Eyi jẹ apẹẹrẹ ti bi koodu HTML rẹ ṣe le wo:
  2. Fun awọn idi ero, iwọ tun le fi kilasi kun aworan kan. Iwọn didara kilasi ni ohun ti a yoo lo ninu faili CSS wa. Akiyesi pe iye ti a lo nibi jẹ lainidii, botilẹjẹpe, fun iru ara yii, a maa n lo awọn iye ti "osi" tabi "ọtun", ti o da lori ọna ti a fẹ aworan wa lati pe. A ri pe iṣedede ti o rọrun lati ṣiṣẹ daradara ati ki o rọrun fun awọn elomiran ti o ni lati ṣakoso aaye kan ni ojo iwaju lati ni oye, ṣugbọn o le fun eyi ni iye kilasi ti o fẹ.
    1. Nipa ara rẹ, iye kilasi yii kii yoo ṣe ohunkohun. Aworan naa kii ṣe deede ti o wa ni apa osi ti ọrọ naa. Fun eyi, a nilo lati tan si faili CSS wa.
  1. Ninu awoṣe rẹ, o le tun fi awọ-ara wọnyi kun:
    1. .left {
    2. float: osi;
    3. padding: 0 20px 20px 0;
    4. }
    5. Ohun ti o ṣe nihin ni lilo ohun elo CSS "float" , eyi ti yoo fa aworan naa kuro ni igbasilẹ deede iwe (ọna ti aworan yoo han, pẹlu ọrọ ti o wa ni isalẹ rẹ) ati pe yoo so o si apa osi ti apo eiyan rẹ . Awọn ọrọ ti o wa lẹhin rẹ ni aṣoju HTML pẹlu bayi fi ipari si ni ayika rẹ. A tun fi diẹ ninu awọn iṣiro padaduro ki ọrọ yii kii ṣe ni taara soke si aworan naa. Dipo, o yoo ni aaye ti o dara julọ ti yoo jẹ oju ti oju ni oju-iwe ti oju-iwe. Ni CSS ti o ṣe deede fun padding, a fi kun awọn iye 0 si oke ati apa osi ti aworan, ati awọn piksẹli 20 si apa osi ati isalẹ. Ranti, o nilo lati fi diẹ ninu awọn paadi ni apa ọtun ti aworan ti o wa ni osi. Aworan deedee ti o tọ (eyi ti a yoo wo ni akoko kan) yoo ni ideri ti a lo si ẹgbẹ osi rẹ.
  2. Ti o ba wo oju-iwe ayelujara rẹ ni aṣàwákiri kan, o yẹ ki o wo bayi pe aworan rẹ wa ni apa osi ti oju-iwe naa ati pe ọrọ dara mu ni ayika rẹ. Ọnà miiran lati sọ eyi ni pe aworan naa "ni ṣiṣan si apa osi".
  1. Ti o ba fẹ lati yi aworan yi pada lati wa ni deede (gẹgẹbi apẹẹrẹ fọto ti o tẹle nkan yii), yoo jẹ rọrun. Ni akọkọ, o gbọdọ rii daju wipe, ni afikun si aṣa ti a fi kun si CSS wa fun iye kilasi ti "osi", a tun ni ọkan fun titọ-ọtun. O dabi iru eyi:
    1. .right {
    2. float: ọtun;
    3. padding: 0 0 20px 20px;
    4. }
    5. O le rii pe eyi jẹ fere si aami kanna si CSS akọkọ ti a kowe. Iyatọ kan ni iye ti a lo fun ohun elo "float" ati awọn ipo ti o padding ti a lo (nfi awọn si apa osi ti aworan wa dipo ti ọtun).
  2. Ni ipari, iwọ yoo yi iye ti aworan aworan kuro lati "osi" si "ọtun" ninu awọn HTML rẹ:
  3. Wo oju-iwe rẹ ni aṣàwákiri nisinsinyi ati aworan rẹ yẹ ki o wa deede si ọtun pẹlu ọrọ ti n murasilẹ ni ayika rẹ. A ṣe deede lati fi awọn aza meji ti o wa, "osi" ati "ọtun" si gbogbo awọn awoṣe wa ki a le lo awọn ọna kika bi o ṣe nilo nigba ti a ba ṣẹda oju-iwe ayelujara. Awọn ọna meji wọnyi jẹ dara julọ, awọn ẹya ara ẹrọ ti o tun ṣe atunṣe ti a le yipada si nigbakugba ti a nilo lati awọn aworan ara pẹlu fifika ọrọ ni ayika wọn.

Lilo HTML Dipo CSS (ati idi ti o yẹ ki o ṣe & # 39; Ṣe Ṣe eyi)

Bó tilẹ jẹ pé ó ṣeé ṣe láti ṣe ọrọ tí a fiwé sí àwòrán àwòrán pẹlú HTML, àwọn ìfẹnukò wẹẹbu pàṣẹ pé CSS (àti àwọn àgbékalẹ tí a gbékalẹ lókè) jẹ ọnà láti lọ kí a lè tọjú ìyàtọ ti ètò (HTML) àti ara (CSS). Eyi ṣe pataki julọ nigbati o ba ro pe, fun awọn ẹrọ ati awọn ipilẹ, ọrọ naa le ma nilo lati ṣàn ni ayika aworan naa. Fun awọn iboju kere ju, oju-iwe aaye ayelujara ti o dahun le nilo pe ọrọ naa n ṣe afihan ni isalẹ aworan naa ati pe aworan naa ni kikun iwọn iboju naa. Eyi ni awọn iṣọrọ ṣe pẹlu awọn ibeere wiwa ti o ba jẹ pe awọn aza rẹ jẹ iyatọ lati idasile HTML rẹ. Ni aye oni-ẹrọ pupọ oni, nibi ti awọn aworan ati ọrọ yoo han yatọ si awọn alejo ti o yatọ ati lori awọn iboju miiran, iyatọ yii jẹ pataki si aseyori ati iṣakoso oju-iwe ayelujara gun-gun.