Awọn ipilẹ alailẹgbẹ Ṣii Awọn Iwaju Fọọmu titun
Ọpọ idi ti o wa lati ma ṣe lo awọn tabili fun ifilelẹ . Ọkan ninu awọn idi ti o ṣe deede julọ fun eniyan lati tẹsiwaju lati lo wọn ni nitori pe o ṣoro lati ṣe ifilelẹ pẹlu CSS. Biotilẹjẹpe iwe afọwọkọ CSS jẹ iṣiro eko, nigbati o ba ni oye bi o ṣe ṣe eto CSS, o le yà ni bi o ṣe rọrun ti o le jẹ. Ati ni kete ti o ba kọ ẹkọ, iwọ yoo ti koju idiyeji ti o wọpọ julọ ti awọn eniyan fi funni nitori lilo CSS- "O ni yarayara lati kọ awọn tabili." O yarayara nitori pe o mọ awọn tabili, ṣugbọn ni kete ti o ba kọ CSS, o le jẹ iyara pẹlu pe.
Bọtini Burausa ti Ipo CSS
Ipo CSS jẹ atilẹyin ni gbogbo awọn aṣàwákiri tuntun . Ayafi ti o ba n kọ aaye kan fun Netscape 4 tabi Internet Explorer 4, awọn onkawe rẹ yẹ ki o ko ni wahala eyikeyi wo awọn oju-iwe ayelujara ti o wa ni CSS.
Rethinking Bawo ni O Ṣe A Page
Nigbati o ba kọ aaye kan nipa lilo awọn tabili, o ni lati ronu ni kika kika. Ni gbolohun miran, o n ronu nipa awọn ọna ti awọn sẹẹli ati awọn ori ila ati awọn ọwọn. Awọn oju-iwe ayelujara rẹ yoo ṣe afihan ọna yii. Nigbati o ba gbe si aṣa oniru ipo CSS, iwọ yoo bẹrẹ si ronu awọn oju-iwe rẹ ni awọn akoonu ti akoonu naa, nitoripe akoonu le wa ni ibikibi ti o fẹ ni ifilelẹ-paapaa laye lori oke akoonu miiran.
Awọn aaye yatọ si ni awọn ẹya ọtọtọ. Lati kọ oju-iwe ti o munadoko, ṣe ayẹwo iṣiro ti eyikeyi oju iwe ṣaaju ki o to fi akoonu sinu rẹ. Oju-iwe apẹẹrẹ le ni awọn apakan apakan marun:
- Akọsori . Ile si ipolongo ipolongo, orukọ aaye, awọn ọna lilọ kiri, akọle akọle ati awọn ohun miiran miiran.
- Ọtun ọtun . Eyi ni ẹgbẹ ọtun ti oju-iwe pẹlu apoti idanimọ, awọn ipolongo, awọn apoti fidio, ati awọn agbegbe iṣowo.
- Akoonu . Awọn ọrọ ti ohun article, post bulọọgi tabi rira tio-awọn eran-ati-poteto ti awọn iwe.
- Awọn ipolongo atline . Awọn ipolowo ipolongo laarin awọn akoonu.
- Ẹlẹsẹ . Ibẹrẹ isalẹ, alaye onkowe, alaye aṣẹ lori ara, awọn ipolongo asia balẹ, ati awọn ibatan ti o ni ibatan.
Dipo ki o fi awọn nkan marun naa wa ni tabili kan, lo awọn ohun elo ti a pin ni HTML5 lati ṣipasi awọn ipin oriṣiriṣi ti akoonu naa, lẹhinna lo ipo CSS lati fi awọn ohun elo ti o wa lori oju-iwe sii.
Ṣiṣayẹwo awọn apakan Awọn akoonu rẹ
Lẹhin ti o ti sọ asọye awọn agbegbe akoonu ti aaye rẹ, o nilo lati kọ wọn sinu HTML rẹ. Nigba ti o le, ni gbogbo igba, gbe awọn abala rẹ ni eyikeyi aṣẹ, o jẹ ero ti o dara lati gbe awọn ẹya pataki julọ ti oju-iwe rẹ akọkọ. Ilana yii yoo ṣe iranlọwọ pẹlu imọ-ẹrọ ti o dara julọ, bakanna.
Lati fi ipo han, wo oju-iwe kan pẹlu awọn ọwọn mẹta ṣugbọn ko si akọsori tabi ẹlẹsẹ. O le lo ipo lati ṣẹda eyikeyi iru ifilelẹ ti o fẹ.
Fun ifilelẹ mẹta-iwe, ṣafihan awọn apakan mẹta: apa osi, apa ọtun, ati akoonu.
Awọn abala wọnyi yoo wa ni ese lẹsẹkẹsẹ nipa lilo ẹda TILE fun akoonu ati meji Awọn ẹya ara ipilẹ fun awọn ọwọn meji. Ohun gbogbo yoo tun ni aami ti o jẹ aami. Nigbati o ba lo ẹda ID, o gbọdọ sọ orukọ kan ti o ni idaniloju fun ID kọọkan.
Nsi akoonu naa
Lilo CSS, ṣafihan ipo fun awọn ohun elo ID'd rẹ. Tọju alaye ipo rẹ ni ipe ara kan bii eyi:
#content {
}
Akoonu laarin awọn eroja wọnyi yoo gba iwọn bi o ti le, eyun 100 ogorun ti iwọn ti ipo ti isiyi tabi oju-iwe naa. Lati ni ipa ni ipo ti apakan kan laisi titẹsi si iwọn ti o wa titi, yi ideri pada tabi awọn ohun elo ala.
Fun ifilelẹ yii, ṣeto awọn ọwọn meji si awọn irọmọ ti o wa titi lẹhinna ṣeto ipo ti o yẹ, ki wọn ki yoo ni ipa nipasẹ ibiti a ti rii wọn ninu HTML.
# osi-iwe {
ipo: idi;
sosi: 0;
iwọn: 150px;
ala-osi: 10px;
ala-oke: 20px;
awọ: # 000000;
padding: 3px;
}
# ọtun-column {
ipo: idi;
sosi: 80%;
oke: 20px;
iwọn: 140px;
padding-left: 10px;
z-index: 3;
awọ: # 000000;
padding: 3px;
}
Nigbana fun agbegbe akoonu, ṣeto awọn ala ti o wa ni apa otun ati osi ki akoonu naa ko ni le bori awọn ọwọn meji ti ita.
#content {
oke: 0px;
ala: 0px 25% 0 165px;
padding: 3px;
awọ: # 000000;
}
Ṣilojuwe oju-iwe rẹ nipa lilo CSS dipo tabili HTML nilo imọran imọ diẹ diẹ, ṣugbọn iyọọda naa wa lati awọn ọna ti o rọrun ati idahun diẹ ati irora ti o rọrun julọ ni ṣiṣe awọn atunṣe igbekale si oju-iwe rẹ nigbamii.