Ua kom zoo nkauj nrog CSS

Siv Fonts, Ciam teb, thiab Dluab rau Dai Kev Ntxhais

Headlines muaj ntau ntawm ntau cov nplooj ntawv web. Qhov tseeb, zoo nkauj ntau npaum li cas txhua daim ntawv pov thawj nyhav muaj tsawg kawg yog ib lub ntsiab lus qhia koj paub lub npe ntawm yam koj nyeem ntawv. Cov headlines no yog siv cov ntsiab lus ntawm HTML - h1, h2, h3, h4, h5, thiab h6.

Rau qee qhov chaw, koj tuaj yeem pom tias cov xov xwm muaj npe uas tsis siv cov ntsiab lus no. Es tsis txhob, cov xov xwm kuj yuav siv cov nqe lus nrog rau cov hoob kawm tshwj xeeb ntxiv rau lawv, los yog kev faib rau cov chav kawm. Yog vim li cas kuv hnov ​​ntau txog qhov tsis yog li no yog qhov tus neeg tsim daim duab "tsis nyiam txoj hau kev saib". Los ntawm kev ua neej, cov hau lus muaj nyob rau hauv cov bold thiab lawv loj loj, tshwj xeeb tshaj yog cov h1 thiab h2 ntsiab uas tso rau hauv loj dua font loj tshaj qhov seem ntawm nplooj ntawv. Nco ntsoov qhov no tsuas yog qhov kev pom zoo ntawm cov ntsiab lus xwb! Nrog CSS, koj tuaj yeem ua rau saib zoo tiam sis koj xav tau! Koj tuaj yeem hloov qhov font loj, tshem tawm cov bold, thiab ntau ntau ntxiv. Lub npe yog txoj kev zoo los mus teev cov nplooj ntawv cov xov xwm. Nov yog qee qhov laj thawj yog vim li cas.

Vim Li Cas Siv Cov Tsab Ntawv Qhia Cov Ntawv Ceem Tsis yog DIVs thiab Styling

Nrhiav Kev Xyaum Sib Txuas Lus Lub Npe


Qhov no yog qhov laj thawj zoo tshaj plaws uas siv cov hau lus, thiab siv lawv ua qhov kev txiav txim siab (ie. H1, ces h2, ces h3, thiab lwm yam). Kev tshawb fawb xyaw ua qhov siab tshaj plaws los ntawm cov ntawv nyeem nrog hauv cov ntawv cim npe vim hais tias muaj ib qho tseem ceeb ntawm cov ntawv nyeem. Ua lwm yam lus, los ntawm kev sau npe ntawm koj nplooj ntawv lub npe H1, koj qhia lub cav kab laug sab uas yog # 1 tsom xam ntawm nplooj ntawv. H2 cov nqe lus muaj # 2, thiab ntxiv rau.

Koj Yuav Tsum Tau Nco Cov Lus Qhia Dab Tsi Koj Siv Los Teev Koj Cov Headlines

Thaum koj paub tias tag nrho koj cov nplooj ntawv Web site yuav muaj ib qho H1 uas yog daim dub, 2em, thiab daj, ces koj tuaj yeem txheeb tau tias ib zaug hauv koj hom ntawv thiab ua tiav. 6 lub hlis tom qab, thaum koj muab cov nplooj ntawv ntxiv, koj tsuas yog ntxiv ib qho H1 rau saum koj nplooj, koj tsis tas yuav rov qab mus rau lwm cov nplooj ntawv kom paub seb hom ntawv tus ID los sis chav kawm twg koj siv los txhais lub ntsiab tawm xov xwm thiab lub hauv siab.

Lawv Muab Kev Piav Qhia Strongly

Cov ntawv teev lus piav qhia yooj yim nyeem. Yog li ntawd, feem ntau cov tsev kawm ntawv hauv US tau qhia cov tub ntxhais kawm ntawv los sau cov lus qhia ua ntej lawv sau ntawv. Thaum koj siv cov cim npe nyob hauv tus qauv qhia ntawv, koj cov ntawv nyeem muaj tseeb qauv uas pom tshwm tuaj sai heev. Ntxiv rau, muaj cov cuab yeej uas tuaj yeem saib xyuas cov nplooj ntawv qhia txog cov lus qhia ua ke, thiab cov ntawv no yuav tau xa cov cim npe rau cov qauv txheej txheem.

Koj Phab Ntawv Yuav Ua Tsi Zoo Nrog Cov Phooj Ywg Tawm

Tsis yog txhua tus tuaj yeem saib lossis siv cov ntawv nplua (thiab qhov no rov qab los rau # 1 - kev tshawb fawb xyaw saib cov ntsiab lus (text) ntawm koj nplooj ntawv, tsis yog cov ntawv txheeb). Yog hais tias koj siv cov cim npe, koj ua koj cov nplooj ntawv siv tau yooj yim dua vim tias cov xov xwm muab cov ntaub ntawv uas ib daim DIV tsis xav tau.

Nws Pab Tau Screen Nyeem thiab Website Accessibility

Kev siv ntawm cov hau kev tsim ib lub qauv teeb meem rau ib daim ntawv. Qhov no yog dab tsi nyeem cov ntawv nyeem yuav siv los "nyeem" ib qhov chaw rau tus neeg siv lub qhov muag tsis pom kev, ua rau koj qhov chaw nkag mus rau cov neeg xiam oob qhab.

Style cov ntawv thiab Font ntawm koj Headlines

Qhov yooj yim tshaj tawm ntawm qhov "loj, siab, thiab npeeb" qhov teeb meem ntawm kev teev cov cim npe yog xav kom cov ntawv nyeem qhov koj xav kom lawv saib. Qhov tseeb, thaum kuv tabtom ua haujlwm rau ib lub vev xaib tshiab, kuv nquag sau nqe lus, h1, h2, thiab h3 yam ua ntej. Kuv feem ntau lo nrog font font tsev neeg thiab loj / luj. Piv txwv, qhov no tej zaum yuav yog ib daim ntawv teev ua ntej rau ib qhov chaw tshiab (cov no yog qee qhov qauv piv txwv uas yuav siv tau):

lub cev, html {margin: 0; padding: 0; } p {font: 1em Arial, Geneva, Helvetica, sans-serif; } h1 {font: bold 2em "Sij hawm tshiab Roman", Sij hawm, serif; } h2 {font: bold 1.5em "Sij hawm tshiab Roman", Sij hawm, serif; } h3 {font: bold 1.2em Arial, Geneva, Helvetica, sans-serif; }

Koj tuaj yeem hloov cov ntawv xa tawm los yog hloov cov ntawv nyeem lossis txawm tias cov ntawv xim . Tag nrho cov no yuav ua rau koj lub npe "ugly" ua ib yam dab tsi ntau vibrant thiab hauv kev ua nrog koj tus qauv.

h1 {font: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; paj: 0; padding: 0; xim: # e7ce00; }

Ciam Teej Tawm Tawm Yuav Hnav tuaj Headlines

Ciam teb yeej yog ib txoj hauv kev zoo los txhim kho koj cov xov xwm. Thiab ciam teb yeej yoojyim ntxiv. Tab sis tsis txhob hnov ​​qab txog kev sim nrog cov ciam teb - koj tsis xav tau ib ciam teb rau txhua sab ntawm koj daim ntawv tshaj tawm. Thiab koj tuaj yeem siv ntau dua li cov tho txawv npav xwb.

h1 {font: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; paj: 0; padding: 0; xim: # e7ce00; ciam teb sab saum toj: khoom # e7ce00 nruab nrab; ciam teb hauv qab: dotted # e7ce00 nyias; dav: 600px; }

Kuv ntxiv ib sab saum toj thiab hauv qab ciam rau kuv tus qauv nqe lus coj los qhia txog qee qhov kev nthuav tawm pom kev. Koj tuaj yeem ntxiv ciam teb rau txhua txoj kev uas koj xav ua kom tiav cov qauv tsim koj xav tau.

Ntxiv Background Images rau koj Headlines Rau ntau Pizazz

Ntau lub vas sab muaj ntu taub hau ntawm sab saum toj ntawm nplooj ntawv uas muaj ib lub ntsiab lus - feem ntau ntawm cov npe ntawm lub npe thiab daim duab. Feem ntau cov neeg tsim qauv xav hais tias qhov no yog ob yam ntsiab lus, tab sis koj tsis tas yuav. Yog hais tias qhov nraaj yog muaj los kho lub ntsiab lus, ces vim li cas ho tsis ntxiv rau cov yeeb yaj kiab?

h1 {font: bold italic 3em / 1em "Times New Roman", "MS Serif", "New York", serif; background: #fff url ("fancyheadline.jpg") rov tso-x hauv qab; padding: 0.5em 0 90px 0; text-align: center; paj: 0; ciam teb hauv qab: khoom # e7ce00 0.25em; xim: # e7ce00; }

Lub tswv yim rau daim ntawv tshaj tawm no yog qhov kuv paub tias kuv daim duab yog 90 pixels siab. Yog li kuv ntxiv padding mus rau hauv qab ntawm lub npe ntawm 90px (padding: 0.5 0 90px 0p;). Koj tuaj yeem ua si nrog cov margins, kab qhov siab, thiab padding kom tau txais cov ntawv nyeem ntawm lub ntsiab lus qhia kom pom tseeb uas koj xav tau.

Ib yam uas yuav tsum nco ntsoov thaum siv cov dluab yog tias koj muaj ib lub website uas teb (uas koj yuav tsum tau) nrog ib qhov kev hloov uas yog hloov raws li cov npo thiab cov cuab yeej siv, koj tshaj tawm tsis tas yuav yog tib lub loj. Yog tias koj xav tau koj lub npe mus ua ib qho loj, qhov no tuaj yeem ua teeb meem. Nws yog ib qhov ntawm vim li cas kuv feem ntau zam cov duab tom qab hauv ib daim ntawv tshaj tawm, kom txias thaum lawv tuaj yeem ntsia.

Daim duab hloov hauv Headlines

Qhov no yog lwm cov txheej txheem nrov rau Web designers vim nws tso cai rau koj los tsim ib lub ntsiab lus nrawm thiab hloov cov ntawv nyeem ntawm cov ntawv cim npe nrog cov duab ntawd. Qhov no yog qhov tseeb ntawm kev xyaum ua luam los ntawm cov neeg tsim tawm hauv internet tau nkag mus rau ob peb lub suab ntawv thiab xav siv ntau yam kab txawv hauv lawv txoj haujlwm. Lub siab ntawm web fonts tau hloov tiag li designers mus kom ze qhov chaw. Headlines tau tam sim no tau teev nyob rau hauv ntau cov fonts thiab cov dluab nrog cov fonts kos muaj tsis ntxiv. Yog li ntawd, koj tsuas yuav pom CSS cov duab hloov chaw rau cov xov xwm hauv cov chaw laus dua uas tsis tau muab kho dua rau cov kev coj ua tshiab.

Thawj tsab xov xwm los ntawm Jennifer Krynin. Edited by Jeremy Girard rau 9/6/17