Dzidza Sei Kugadzira Fancy Initial Caps Uchishandisa CSS neZvifananidzo
Dzidza kuti ungashandisa sei CSS kuti ugadzire mafashoni ekutanga emafaira ako. Pano pane chimiro chechimiro chekuchinja chinoshandiswa kushandisa chinyorwa chekufananidzira chekutanga rako.
Basic Styles of Initial Caps
Pane zvitatu zvepakutanga zvekutanga mapepa mumagwaro:
- yakasimudzwa - yakawanda kwazvo, iyo tsamba yekutanga yakakura uye pamutsara wakafanana neyozvino.
- yakadonha - zvakare yakajeka, iyo tsamba yekutanga yakakura uye yakakanda pasi pasi pekutanga kwemashoko. Musoro unotevera unofamba uchikomberedza.
- pedo - apo tsamba yekutanga iri mune imwe korombo kunze kwezvose zvakanyorwa. Izvi zvinowanzoshandiswa mukudhinda kupfuura Web design.
Pakutanga caps or drop caps vanoziva zvikuru. Ndiyo nzira yakanakisisa yokupfekedza zvisingagone kwenguva refu uye inokanganisa zvinyorwa zvemashoko. Uye nedzimba yeCSS: tsamba yekutanga, iwe unogona nyore kutsanangura kuti ungaita sei tsamba yako yekutanga fancier.
Gadzira Chinyorwa Chaicho Chekutanga Cap
Zvose zvaunoda kuita kuti ugadzire chikwata chekutanga chekusimudza ndechokuti iwe tsamba yekutanga yemavara yako iwedzere muhukuru netsamba yekutanga pseudo-element:
p: yekutanga-tsamba {font-size: 3em; }Asi mabheji mazhinji anoona kuti tsamba yekutanga yakakura kudarika mamwe ose ari pamutsara, saka vanoita zvinotungamirira zvakaenzana nezvingave zvine musoro kune tsamba iyoyo yekutanga, kwete iyo yose yakasara. Nenguva isipi, izvi zviri nyore kugadzirisa nemutsetse wekutanga pseudo-element uye nzvimbo yakakwirira-yepamusoro:
p: yekutanga-tsamba {font-size: 3em; } p: rokutanga-line {line-height: 1em; }Tamba nekwakakwirira kwemukati mukati megwaro rako kusvikira uwana hukuru hwakakodzera hwemashoko ako.
Tamba neKukutanga Kwako Cap
Kana ukangonzwisisa kuti iwe ungagadzira sei kapu yekutanga, unogona kuzvipfekedza muzvishongo zvemavara kuti uite kuti zvive pachena. Tamba nemirau, mavara emumucheto, miganhu, kana chero chipi chinotyisa iwe fancy yako. Nzira yakajeka ndeyekudzosera mavara efonti yako uye ruvara rwemuvara kune tsamba yekutanga:
p: yekutanga-tsamba {font-size: 300%; mamiriro acho-ruvara: # 000; ruvara: #fff; } p: rokutanga-line {line-height: 100%; }Imwe nzira yokunyengera ndeyokuisa mutsara wekutanga. Izvi zvinogona kunge zvakanyangadza neCSS, sezvo pakati peyinyorwa mutsara inogona kunge yakasiyana kana urongwa hwako huchigadziriswa. Asi kune vamwe vachitamba-svetana nemitemo, unogona kutora mutsara wako wokutanga zvakakwana kuita kuti tsamba yekutanga ionekwe iri pakati. Ingotamba nemapepanisi pane zvinyorwa-zvinyorwa zvemavara kusvika zvichitarisa zvakanaka:
p: yekutanga-tsamba {font-size: 300%; mamiriro acho-ruvara: # 000; ruvara: #fff; } p: rokutanga-line {line-height: 100%; } p {ndima-indent: 45% ; }Zvichida Pakutanga Caps zvakaoma neCSS
Zvimwe zvekare zvekare zvinogona kunge zvakaoma neCSS nokuti vheji dzakasiyana dzinoratidza mafonti zvakasiyana. Pfungwa yekugadzira chikamu chiri pedyo neCSS ndechokushandisa shanduro-indent pfuma pamutsara wokutanga kuti ibudise kunze (kuruboshwe) kushaya kunaka. Iwe uchazofanirawo kuchinja rutivi rworuboshwe rwemavara acho nemamwe mari. Tamba nezviyero izvi kusvikira ndima ichiratidza zvakanaka.
p {text-indent: -2.5em; marginal-left: 3em; ▣ p: tsamba yekutanga {font-size: 3em; } p: rokutanga-line {line-height: 100%; }Kuwana Chaizvo Chakanaka Chakutanga Caps
Nzira yakanakisisa yokugadzira chikwata chekutanga chekufungidzira ndechekushandura iyo faira kune imwe mhuri inoshongedza yemhando. Kana iwe ukashandisa rutsva rwemafonti rakateverwa nemhando yetiyiti , inobatsira kutsigira kuti kapu yako yokutanga inoratidzira zvakanaka zvokuti vatengi vako vanogona kuiona, pasina kupinda muhutano uye nyaya dzekugadzirisa.
p: yekutanga-tsamba {font-size: 3em; font-family: "Edwardian Script ITC", "Brush Script MT", cursive; } p: rokutanga-line {line-height: 100%; }Uye, sezvinowanzoitwa, iwe unogona kuisa mazano aya ose pamwe chete kuti ugadzire chikwata chekutanga chekutsvaga mavara kune ndima yako.
Achishandisa Graphical Initial Cap
Kana, mushure mezvose izvi, iwe usingadi kuti makopi ako epakutanga anotarisa sei peji, unogona kushandisa mavara kuti uwane chaiwo chauri kutsvaga. Asi usati wasarudza kutamira zvakananga kumifananidzo, iwe unofanirwa kunge uchiziva zvikanganiso zveiyi nzira:
- Masoka asina mifananidzo haazooni kapu yekutanga, uye haazooni magwaro akavanzika ayo mufananidzo uri kutora. Izvi zvinogona kuita kuti ndima isasvike, kana pazvinenge zvakaoma kuverenga.
- Mifananidzo nguva dzose inowedzera panguva yekudzivirira ye peji. Kana uine zvakawanda zvekutanga, iwe unogona kuwedzerwa nguva yekudzikinura yechinhu icho vanhu vazhinji vangafunga kuti hachikoshi.
- Mamwe mapurisa acharatidza zvose tsamba yakavanzika yekutanga uye mufananidzo - izvo zvinogona kuita kuti ndima yacho isave yakajeka.
- Zvakanyanya kuoma kuzviita sarudzo iyi, sezvo iwe uchifanira kuziva chaizvo kuti tsamba yekutanga ndeyekuti ushandise mifananidzo yakakodzera. Saka, nguva dzose iyo ndima yakagadziridzwa, unogona kudika kugadzira mifananidzo yakajeka.
Kutanga, iwe unofanirwa kuumba mifananidzo yekutanga tsamba. Ndakashandisa Photoshop kuti ndigadzire tsamba L nemhando "Edwardian Script ITC". Ini ndakazviita zvakakura - 300pt muhukuru. Ndakabva ndanyengedza mufananidzo wacho kusvika kune zvishoma zvishoma zvakapoteredza tsamba uye ndakaona mufananidzo weupamhi uye urefu.
Ipapo ndakaumba kirasi "capL" ye ndima yangu. Apa ndipo pandinofananidza chifananidzo chei chishandise, iyo inotungamirira (mutsara-yakakwirira), nezvimwe zvakadaro.
Iwe unofanirwa kushandisa mufananidzo weupamhi uye urefu kuti uise ndima yendima-indent uye padding-top. Nokuda kwemufananidzo wangu L, ndaida 95px indent uye 72px padding.
p.capL {line-height: 1em; mamiriro-emufananidzo: url (capL.gif); mhemberero-dzokorora: kwete-kudzokorora; zvinyorwa-zvinyorwa: 95px; padding-top: 72px; }Asi hazvisi zvose. Kana iwe ukaisiya ikoko, ipapo tsamba yokutanga ichinyorwa mu ndima - kutanga nemifananidzo, zvakare mumashoko. Saka, ndakawedzera nzvimbo yakapoteredza chikamu ichocho chekutanga nekirasi "kutanga" - uye akaudza shanduro kuti irege kuratidza tsamba iyo:
span.initial {kuratidza: hapana; }Uye iyo yakajeka zvino inoratidza zvakanaka. Iwe unogona kutamba nemashoko-chidimbu pane ndima kuitira kuti mutsara urambe wakananga kusvika kune tsamba, zvisinei iwe unoda kuti iratidze.