Mụta otú e si emepụta Mpịakọta Mbụ nke Fancy Jiri CSS na Images
Mụta otú e si eji CSS emepụta ihe mkpuchi mbụ maka paragraf gị. Ọbụna usoro ngbanwe nke onyinyo dị mfe iji jiri eserese ese onyinyo nke mbụ gị.
Ntọala nke Mmiri nke Mbụ Ndị Mbụ
E nwere ụzọ atọ dị mkpa nke isi akpa n'ime akwụkwọ:
- a zụlitere - nke kachasị, ebe akwụkwọ ozi mbụ dị buru ibu na n'otu akara dịka ederede dị ugbu a.
- dakwasịrị - dịkwa ka ọ dịkarị, ebe akwụkwọ ozi mbụ buru ibu ma daa n'okpuru ederede mbụ. Ihe odide na-esonụ na-agagharị na ya.
- n'akụkụ - ebe akwụkwọ ozi mbụ dị n'otu kọlụm n'akụkụ ihe odide ndị ọzọ. Nke a bụ ihe a na-ejikarị ebipụta karịa imewe Web.
Ebube mbụ ma ọ bụ kaadị ọdịda maara nke ọma. Ha bụ ụzọ dị ukwuu isi ejiji ma ọ bụ ogologo oge ma na-agwụ ike nke ederede. Na akwukwo CSS: akwukwo mbu, i nwere ike ighota uzo esi eme akwukwo ozi mbu gi.
Mepụta Mpị Mbụ Mfe
Ihe niile ị ga - eme iji mepụta isi ihe dị elu bụ iji mee ka akwụkwọ ozi mbụ nke paragraf gị dịkwuo nha na ntinye akwụkwọ edemede mbụ:
p: akpa-leta {font-size: 3em; }Ma ọtụtụ ndị na-eme nchọgharị na-achọpụta na akwụkwọ ozi mbụ ka ibu karịa ederede ndị ọzọ na akara ahụ, ya mere, ha na-eme ka ndị na-ebute ụzọ dị ka ihe dị mkpa maka akwụkwọ ozi mbụ ahụ, ọ bụghị nke ọzọ. N'ụzọ dị nro, nke a dị mfe idozi na pseudo-mmewere na nke mbụ na-adị elu:
p: akpa-leta {font-size: 3em; } p: akara nke mbụ {akara-elu: 1em; }Jirinụ akara dị elu n'ime akwụkwọ gị ruo mgbe ịchọta oke kwesịrị ekwesị maka ederede gị.
Jiri igodo mbu gị
Ozugbo ị ghọtara esi emepụta okpu mbụ, ị ga-eji ejiji akwa uwe iji mee ka ọ pụta ìhè. Jirinụ agba na agba, agbado, ala, ma ọ bụ ihe ọbụla na-emetụta gị. Otu ụzọ dị mfe bụ iji weghachite agba nke akara ngosi na akwa agba gị maka akwụkwọ ozi mbụ:
p: akpa-leta {font-size: 300%; ndabere-agba: # 000; agba: #fff; } p: akara mbụ (akara ntinye: 100%; }Ụgha ọzọ bụ itinye etiti akpa. Nke a nwere ike ịghọ aghụghọ na CSS, dịka etiti ederede ederede nwere ike ịdị iche ma ọ bụrụ na nhazi gị dị mfe. Ma na ụfọdụ na-egwugharị na ụkpụrụ ndị ahụ, ị nwere ike ịmalite akara mbụ gị iji mee ka akwụkwọ ozi mbụ dị na etiti. Naanị igwu egwu na pasent na ederede-okwu nke paragraf ahụ ruo mgbe ọ dị mma:
p: akpa-leta {font-size: 300%; ndabere-agba: # 000; agba: #fff; } p: akara mbụ (akara ntinye: 100%; } p {ederede-indent: 45% ; }Ebube nke mbụ dị nso na-esiri CSS ike
Nkwụsị mbụ nwere ike isi ike na CSS n'ihi na ihe nchọgharị dị iche iche na-egosipụta ụdị dị iche iche. Ebumnuche n'azụ ịmepụta ihe dị n'akụkụ okpu na CSS bụ iji ihe odide ederede na akara mbụ iji bulie ya (n'aka ekpe) uru dị njọ. Ọ ga-adị mkpa ka ị gbanwee akụkụ aka ekpe nke paragraf ahụ site na ọnụọgụ ụfọdụ. Jiri ọnụ ọgụgụ ndị a rụọ ọrụ ruo mgbe paragraf ahụ dị mma.
p {ederede-indent: -2.5em; oke-aka ekpe: 3em; } p: akpa-leta {font-size: 3em; } p: akara mbụ (akara ntinye: 100%; }Inwe Mgbapụta Mbụ Mbụ
Ụzọ kachasị mma isi mepụta okpu mbụ ị ga-achọ bụ ịgbanwe ụdị a na-eme ka ezinụlọ ndị ọzọ dị mma. Ọ bụrụ na ị na-eji ụdị fon dị iche iche na- esote site na font , ọ ga-enyere aka jide n'aka na okpu mbụ gị na-egosi nke ọma ka ndị ahịa gị wee hụ ya, na-enweghị ịbanye na nnweta mbipụta.
p: akpa-leta {font-size: 3em; ndị na-eme ihe-ezinụlọ: "ederede Edwardia Script ITC", "Brush Script MT", cursive; } p: akara mbụ (akara ntinye: 100%; }Na, dịka ọ dị na mbụ, ịnwere ike itinye aro ndị a niile iji mepụta isi nke mbụ na mgbasa ozi gị na paragraf gị.
Iji Okpokoro Mbụ Ejiji
Ọ bụrụ na, mgbe nke ahụ gasịrị, ị ka na-enweghị mmasị otú ọkwa mbụ gị si elee anya na ibe ahụ, ịnwere ike ịchọta ndịna-emeputa ka ị nweta kpọmkwem ihe ị na-achọ. Mana tupu ị kpebie ịkwaga ndị na - eserese, ị kwesịrị ịmara ihe ndozi nke usoro a:
- Ndị ahịa na-enweghị ihe oyiyi agaghị ahụ okpu mbụ, ma ọ gaghị ahụ ederede zoro ezo nke oyiyi ahụ nọchiri. Nke a nwere ike ime ka paragraf ghara ịgafe, ma ọ bụ nke kachasị mfe ịgụ.
- Images na-agbakwụnye na oge nbudata nke ibe. Ọ bụrụ na ị nwere ọtụtụ ọkwa mbụ, ị nwere ike iwelie oge nbudata oge ka ọtụtụ ihe ndị mmadụ wee chee na ọ dị ntakịrị.
- Ụfọdụ ndị nchọgharị ga-egosipụta ma ọ bụ akwụkwọ mbụ zoro ezo na onyinyo ahụ - nke nwere ike ime ka ederede paragraf dị ka ihe efu.
- O siri ike ịmepụta nhọrọ a, n'ihi na ị ga-ama kpọmkwem ihe akwụkwọ ozi mbụ ahụ bụ ka i jiri akara ngosi ziri ezi. Ya mere, oge obula edere paragraf ahụ, ị nwere ike ịmepụta ihe ngosi ọhụrụ.
Mbụ, ịkwesịrị ịmepụta ihe ngosi nke akwụkwọ ozi mbụ. M jiri Photoshop mepụta akwụkwọ ozi L na ụdị "Edwardian Script ITC". M mere ya nnukwu - 300pt na size. Mgbe ahụ, m na-agbada onyinyo ahụ ruo na nke kacha nta na leta ahụ wee hụ ọkwa na elu.
M meziri klas "capL" maka paragraf m. Nke a bụ ebe m na-akọwa ihe oyiyi ị ga-eji, isi (ogo-elu), na ihe ndị ọzọ.
Ikwesiri iji obosara ihe di elu na idi elu iji dozie ederede ederede na ntanye akwa. Maka ọdịdị L, ọ dị m mkpa 95px na 72px padding.
p.capL {akara-elu: 1m; ndabere-oyiyi: url (capL.gif); ndabere-ikwugharị: ọ dịghị-emeghachi; ederede-indent: 95px; padding-n'elu: 72px; }Ma nke ahụ abụghị ihe niile. Ọ bụrụ na ị hapụ ya n'ebe ahụ, mgbe ahụ, a ga-edegharị akwụkwọ mbụ ahụ na paragraf - nke mbụ na ihe ngosi, mgbe ahụ na ederede. Ya mere, agbakwunyere m ihe mbụ ahụ na klas "mbụ" - ma gwa onye nchọgharị ahụ ka ọ ghara igosi akwụkwọ ozi ahụ:
span.initial {ngosi: ọ dịghị; }Na onye ngosi na-egosiputa n'ụzọ ziri ezi. Ị nwere ike igwu egwu na ederede-edere na paragraf ahụ iji mee ka ederede ederede ruo leta ahụ, Otú ọ dị ịchọrọ ka ọ gosipụta.