Омӯзед, ки чӣ гуна эҷоди коғазҳои қиматбаҳои аввалия бо CSS ва тасвирҳо
Омӯзед, ки чӣ гуна истифодаи CSS-ро барои эҷоди сарлавҳаҳои ибтидоӣ барои параграфҳои худ истифода баред. Ҳатто техникаи ивазкунандаи содда вуҷуд дорад, ки барои истифодаи тасвири графикӣ барои сарпӯши ибтидоии шумо вуҷуд дорад.
Нишондиҳии асосӣ дар сарлавҳаҳои ибтидоӣ
Ҳуҷҷатҳои асосӣ дар ҳошияҳои ибтидоӣ мавҷуданд:
- баланд бардоштани маъмултарин, ки дар он номаи якум калонтар ва дар ҳамон сатр бо матни ҷорӣ мавҷуд аст.
- - пошхӯрии умумӣ, ки дар он номаи яктарафа калон аст ва поён аз сатри якуми матн поён фаромадааст. Баъд матни зерин дар атрофи он шино мекунад.
- дар якҷоягӣ - дар номаи якум дар як сутуни назди қисми дигари матн. Ин бештар аз чопи тарҳрезии веб аст.
Қабатҳои сарпечӣ ё сарпӯшакҳо хеле хуб шиносанд. Онҳо тарзи хуби либоспӯшиҳои дароз ва сангинтарини матн мебошанд. Ва бо амволи CSS: як нома, шумо метавонед ба осонӣ метавонед, ки чӣ тавр ба ҳарфҳои яктарафаи худ табдил диҳед.
Коҳиши оддии ибтидоиро эҷод кунед
Ҳамаи шумо бояд барои эҷоди як воҳиди ибтидоӣ даровардани соддатар кардани тасвири нахустин параграфи шумо бо андозаи калонтар бо аломати якум-почтаи электронӣ:
p: аввалин мактуб {font-size: 3em; }}Аммо бисёр браузерҳо мебинанд, ки номаи якум аз матни хатогии калимаҳо калонтар аст, бинобар ин, онҳо барои муқоисаи як нома, на он чиро, Хушбахтона, ин осон ба ислоҳ кардани пневмон-унсурҳои якум ва хосияти хати баланд:
p: аввалин мактуб {font-size: 3em; } p: як сатри {{line-height: 1em; }}То он даме, ки шумо барои матни шумо тасвири дурустро пайдо кунед, дар баландии сатр дар ҳуҷҷати худ оча.
Бо сарпӯши ибтидоии шумо бозӣ кунед
Вақте ки шумо фаҳмед, ки чӣ гуна эҷоди сарпӯши ибтидоӣ, шумо метавонед онро дар либосҳои либоси зебо пӯшед, то ки онро дур кунед. Бо рангҳо, рангҳои зеҳнӣ, сарҳадҳо, ё чизи дилхоҳ ба даст оред. Як услуби оддии содда ин ранг кардани ранги сурх ва ранги аслии шумо барои ҳарфи ҳарфи аввал аст:
p: аввалин мактуб {font-size: 300%; ранги аслии: # 000; ранг: #fff; } p: як сатри {{line-height: 100%; }}Ҳайати дигар - маркази хатти аввал мебошад. Ин метавонад бо CSS хато бошад, зеро миқдори хатҳои матн метавонад дигаргун шавад, агар тарҳи шумо тағйир ёбад. Аммо бо якчанд бозӣ бо арзишҳо, шумо метавонед як сатри якумро ба даст оред, то ки номаи якумро дар мобайн пайдо кунед. Танҳо бо фоиз дар матни ибтидоии параграф то он даме, ки дуруст аст:
p: аввалин мактуб {font-size: 300%; ранги аслии: # 000; ранг: #fff; } p: як сатри {{line-height: 100%; } p {text-indent: 45% ; }}Капиталҳои аввалин бо CSS сахт мебошанд
Қуттиҳои аввалинро бо CSS мушкил кардан мумкин аст, зеро дар браузерҳои гуногун рангҳои гуногунро нишон медиҳанд. Ҳадафи пас аз эҷоди воҳиди ҳамсоя дар CSS ин аст, ки моликияти матниро дар сатри аввал истифода барад (ба чап) арзиши манфӣ. Шумо ҳамчунин бояд ба марзи чапи параграф бо якчанд сатр иваз кунед. Бо ин рақамҳо то даме, ки параграф нек бошад, бозӣ кунед.
p {text-indent: -2.5em; margin-left: 3em; } p: аввалин мактуб {font-size: 3em; } p: як сатри {{line-height: 100%; }}Дастпазакҳои аслӣ дар ҳақиқат ба даст меояд
Беҳтарин роҳи эҷоди як сарлавҳаи ибтидоӣ дар феҳрист тағйир додани font барои оилаи калонии шеваи ороишӣ мебошад. Агар шумо як силсила функсияҳоеро истифода баред, ки пас аз шарти генералӣ истифода мешавад , он кафолат медиҳад, ки сарпӯши ибтидоии шумо хуб аст, то ки мизоҷони шумо онро бе дастрасӣ ба ҳалли дастрасӣ ва истифодаи имконпазири он таъмин кунанд.
p: аввалин мактуб {font-size: 3em; font-family: "Edwardian Script ITC", "Script Script MT", пойбандӣ; } p: як сатри {{line-height: 100%; }}Ва, одатан, шумо метавонед ҳамаи ин пешниҳодҳоро якҷоя кунед, то як воҳиди ибтидоӣ, ки сабки рекламаро ба параграфи худ эҷод кунед.
Истифодаи сарлавҳаи ибтидоии графикӣ
Агар, пас аз ин ҳама, шумо ҳанӯз намехоҳед, ки чӣ гуна сарлавҳаҳои ибтидоии шумо дар саҳифа назар кунанд, шумо метавонед ба графикӣ барои пайдо кардани таъсири дақиқе, ки шумо ҷустуҷӯ мекунед. Аммо пеш аз он ки шумо қарор кунед, ки ба таври графикӣ ҳаракат кунед, шумо бояд аз усулҳои ин усул огоҳ шавед:
- Муштариёни бе тасвирҳо сарпӯши ибтидоро намебошанд ва матни пинҳонии онро иваз мекунанд. Ин метавонад параграфро ба даст орад ё ба таври осон хонданро осон кунад.
- Тасвирҳо ҳамеша ба вақти боркунии саҳифа илова карда мешаванд. Агар шумо ҳадди аққал ибтидоӣ дошта бошед, шумо метавонед вақти зиёдро барои зиёд кардани эҳсосоти зиёди одамон эҳсос кунед.
- Баъзе браузерҳо ҳар ду паём ва пинҳон пинҳон мешаванд, ки метавонист параграфи матниро бинанд.
- Барои ин автоматӣ ин автоматро хеле душвор аст, чунонки шумо бояд донед, ки ҳар як нома чӣ гуна аст, то шумо графикии дурустро истифода баред. Пас, ҳар боре, ки параграф таҳрир карда мешавад, ба шумо лозим аст, ки графикаи нав эҷод кунед.
Аввалан, шумо бояд графикаи ҳарфи аввали эҷодро эҷод кунед. Ман Photoshop-ро истифода бурда, эффектро бо "Edwardian Script ITC" офаридааст. Ман онро калон - 300pt дар андозаи. Ман пас ин тасвирро то ба ҳадди аққал дар атрофи хатти гудозишуда ва васеъ кардани тасвир ва баландии тасвирро қайд менамоям.
Сипас ман синфро "capL" -ро барои параграфи худ офаридем. Ин аст, ки дар куҷо ман тасвиреро, ки барои истифодабарӣ, роҳбарӣ (лутф) ва ғайра муайян кунед.
Шумо бояд васеъ ва баландии тасвирро барои танзим кардани матн-матн ва болоии болоӣ параграф кунед. Барои тасвири L, ман 95px ва 72px padding лозим буд.
p.capL {line-height: 1em; background-image: url (capL.gif); background-repeat: no-repeat; text-indent: 95px; padding-top: 72px; }}Аммо ин ҳама нест. Агар шумо онро дар он ҷо тарк кунед, пас ҳарфе, ки дар сархати якум навишта мешавад, аввал бо график, сипас дар матн. Ҳамин тавр, ман дар атрофи он як унсури аввал бо синфи "ибтидоӣ" илова кардам ва ба браузери худ гуфт, ки ин нома нишон надиҳад:
span.initial {display: none; }}Ва график пас аз он дуруст нишон медиҳад. Шумо метавонед бо матн дар матн истинод кунед, то ки матнеро, ки дар боло номбар кунед, пахш кунед, аммо шумо онро мехоҳед намоиш диҳед.