Mọ Bi o ṣe le Ṣẹda Awọn Ikọkọ Akọkọ Fancy Lilo CSS ati Awọn Aworan
Mọ bi o ṣe le lo CSS lati ṣẹda awọn bọtini akọkọ fun awọn paragira rẹ. O tun jẹ ilana iyipada aworan ti o rọrun lati lo aworan ti a fi aworan rẹ han fun ibẹrẹ iṣaju rẹ.
Awọn Ipele Ibẹrẹ ti Awọn Ikọkọ Ikọkọ
Awọn oriṣi ipilẹ mẹta wa ni awọn akọle akọkọ ninu awọn iwe aṣẹ:
- ti a gbe dide - ibi ti o wọpọ julọ, nibiti lẹta akọkọ jẹ tobi ati ni ila kanna bi ọrọ ti isiyi.
- silẹ - tun jẹ wọpọ, ibi ti lẹta akọkọ jẹ tobi o si ṣubu silẹ ni isalẹ ila akọkọ ti ọrọ. Awọn ọrọ wọnyi lẹhinna ṣaakiri ni ayika rẹ.
- nitosi - ibi ti lẹta akọkọ wa ninu iwe kan lẹgbẹ ti iyokù ọrọ naa. Eyi jẹ wọpọ julọ ni titẹ ju apẹrẹ ayelujara.
Awọn bọtini akọkọ tabi ju awọn bọtini mu wa ni imọran. Wọn jẹ ọna ti o dara julọ lati wọṣọ bibẹkọ ti awọn igba ti o gun ati awọn alaidun ti ọrọ. Ati pẹlu ohun elo CSS: lẹta akọkọ, o le ṣafihan bi o ṣe le ṣe awọn lẹta akọkọ rẹ.
Ṣẹda Ibẹrẹ Akọbẹrẹ Tuntun
Gbogbo awọn ti o nilo lati ṣe lati ṣẹda ikunkọ iṣaju ti o rọrun ni lati ṣe lẹta akọkọ ti paragira rẹ tobi ni iwọn pẹlu iwe-aṣoju-lẹta-akọkọ:
p: akọkọ-lẹta {font-size: 3em; }Ṣugbọn ọpọlọpọ awọn aṣàwákiri ri pe lẹta akọkọ jẹ tobi ju awọn iyokù ti ọrọ naa lọ lori ila, nitorina wọn ṣe awọn asiwaju to dogba si ohun ti yoo ṣe oye fun lẹta akọkọ, kii ṣe iyokù ti ila naa. Oriire, eyi ni o rọrun lati ṣatunṣe pẹlu iṣiro-ti-ni-akọkọ ati awọn ohun-ini ila-ila:
p: akọkọ-lẹta {font-size: 3em; } p: ila akọkọ [ila-ila: 1; }Mu pẹlu iwọn ila laarin iwe rẹ titi ti o yoo fi ri iwọn ọtun fun ọrọ rẹ.
Mu pẹlu Akọbẹrẹ Ibẹrẹ rẹ
Lọgan ti o ba ni oye bi o ṣe le ṣọọda iṣafihan akọkọ, o le wọ aṣọ ni awọn aṣọ ẹwà lati ṣe ki o jade. Mu pẹlu awọn awọ, awọn awọ ti o wa lẹhin, awọn aala, tabi ohunkohun ti o bii si ifẹkufẹ rẹ. Ọna ti o rọrun julọ ni lati yi awọn awọ ti awo rẹ ati awọ-awọ lẹhin pada fun lẹta akọkọ:
p: akọkọ-lẹta {font-size: 300%; awọ-lẹhin: # 000; awọ: #fff; } p: ila akọkọ [ila-ila: 100%; }Ẹtan miran ni lati ṣaju ila akọkọ. Eyi le jẹ ẹtan pẹlu CSS, bi arin ti laini ọrọ naa le jẹ yatọ si ti ifilelẹ rẹ jẹ rọ. Ṣugbọn pẹlu diẹ ninu awọn ti ndun ni ayika pẹlu awọn iye, o le jẹ ki ila akọkọ rẹ to lati ṣe ki lẹta akọkọ ba wa ni arin. O kan ṣiṣẹ pẹlu ipin ogorun lori ọrọ-inu ti paragirafi titi ti o fi han:
p: akọkọ-lẹta {font-size: 300%; awọ-lẹhin: # 000; awọ: #fff; } p: ila akọkọ [ila-ila: 100%; } p {text-indent: 45% ; }Awọn ibudo akọkọ ti o wa nitosi jẹ Lile pẹlu CSS
Awọn bọtini akọkọ ti o sunmọ ni o le nira pẹlu CSS nitori awọn aṣàwákiri oriṣiriṣi ṣe afihan awọn lẹta lẹsẹsẹ. Idii lẹhin ṣiṣẹda ohun ti o wa nitosi ni CSS jẹ lati lo ohun elo-indent lori ila akọkọ lati gbe jade (si apa osi) iye ti ko dara. Iwọ yoo tun nilo lati yi apa osi ti paragifi yii nipasẹ diẹ ninu iye. Mu awọn nọmba wọnyi ṣiṣẹ titi ipin paragiran yoo dara.
p {text-indent: -2.5em; ala-osi: 3m; } p: akọkọ-lẹta {font-size: 3em; } p: ila akọkọ [ila-ila: 100%; }Ngba Awọn Ipele Ibẹrẹ Fancy
Ọna ti o dara julọ lati ṣẹda apo iṣan ti o fẹran ni lati yi ẹrọ pada si ẹbi ti ẹṣọ diẹ ẹ sii. Ti o ba lo iruwe awọn atẹkọ ti a tẹsiwaju nipasẹ fọọmu oniruuru , yoo ṣe iranlọwọ fun idaniloju pe apo iṣọla rẹ ti fihan daradara ki awọn onibara rẹ le rii, lai si ni idaniloju ati awọn oran lilo.
p: akọkọ-lẹta {font-size: 3em; awọn ẹda-aṣiṣe: "Iwe-iwe ITC-Edwardian", "Brush Script MT", cursive; } p: ila akọkọ [ila-ila: 100%; }Ati, gẹgẹbi o ti ṣe deede, o le fi gbogbo awọn imọran wọnyi jọpọ lati ṣẹda ibẹrẹ akọkọ ti aṣa ipolowo si ipinlẹ rẹ.
Lilo Akọkọ Iwọn fọto
Ti o ba jẹ pe, lẹhin gbogbo eyi, iwọ ko tun fẹ bi awọn oju-iṣaju akọkọ ti wo oju-iwe naa, o le ṣe igbimọ si awọn eya aworan lati gba ipa gangan ti o n wa. Ṣugbọn ṣaaju ki o to pinnu lati gbe lọ si awọn aworan ti o tọ si, o yẹ ki o jẹ akiyesi awọn drawbacks ti ọna yii:
- Awọn alabara ti kii ṣe awọn aworan kii yoo ri akọle akọkọ, ati pe o le ma ri ọrọ ti a fi pamọ ti aworan naa npo pada. Eyi le ṣe ikọwe ko ṣeeṣe, tabi ni iṣoro julọ lati ka.
- Awọn aworan kun nigbagbogbo si akoko gbigba lati ayelujara kan. Ti o ba ni ọpọlọpọ awọn bọtini iṣaaju, o le ṣe alekun akoko igbasilẹ fun ohun ti ọpọlọpọ awọn eniyan yoo nira pe ko ṣe pataki.
- Awọn aṣàwákiri kan yoo ṣe afihan lẹta akọkọ ti o farapamọ ati aworan naa - eyi ti o le jẹ ki ọrọ paragika ba dara.
- O jẹ gidigidi lati ṣetọju aṣayan yi, bi o ti ni lati mọ pato ohun ti lẹta akọkọ jẹ pe ki o lo iru iwọn ti o tọ. Nitorina, ni igbakugba ti a ba ṣatunkọ ipinlẹ naa, o le nilo lati ṣẹda titun kan.
Ni akọkọ, o nilo lati ṣẹda aworan ti lẹta akọkọ. Mo lo Photoshop lati ṣẹda lẹta L pẹlu apẹrẹ "Edwardian Script ITC". Mo ṣe o tobi - 300pt ni iwọn. Mo lẹhinna kọn aworan naa si isalẹ ti o kere julọ ni ayika lẹta naa ati ki o woye igun aworan ati giga.
Nigbana ni mo ṣẹda kilasi "capL" fun ipinlẹ mi. Eyi ni ibi ti mo ti setumo ohun ti aworan lati lo, asiwaju (ila-iga), ati bẹbẹ lọ.
O nilo lati lo igun aworan ati giga lati ṣeto awọn ọrọ-indent ati padding-top. Fun aworan L mi, Mo nilo 95px indent ati 72px padding.
p.capL {ila-iga: 1m; lẹhin-aworan: url (capL.gif); lẹhin-tun: ko-tun; ọrọ-indent: 95px; padding-top: 72px; }Ṣugbọn kii ṣe gbogbo. Ti o ba fi silẹ nibẹ, lẹhinna lẹta akọkọ yoo wa ni idiyele ni paragirafi - akọkọ pẹlu akọrin, lẹhinna ninu ọrọ naa. Nitorina, Mo fi kun igba diẹ ni ayika akọkọ akọkọ pẹlu "kilasi" kilasi - o si sọ fun aṣàwákiri lati má ṣe fi lẹta naa han:
span.initial {àpapọ: kò; }Ati awọn ti iwọn lẹhinna han daradara. O le mu pẹlu awọn ọrọ-indent lori paragirafi lati gba ọrọ naa ni ọtun si lẹta, ṣugbọn o fẹ lati ṣe ifihan.