Ceannteidil Fancy a dhéanamh le CSS

Úsáid Clónna, Teorainneacha, agus Íomhánna chun Ceannlínte a Mhaisiú

Tá ceannlínte coitianta ar an chuid is mó de na leathanaigh ghréasáin. Go deimhin, bíonn go leor ceannlíne amháin ar a laghad ar aon doiciméad téacs ionas go mbeidh a fhios agat an teideal atá á léamh agat. Déantar na cinnlínte seo a chódú ag baint úsáide as na heilimintí ceannteidil HTML - h1, h2, h3, h4, h5, and h6.

Ar roinnt suíomhanna, b'fhéidir go gceadaítear na ceannlínte sin gan na heilimintí seo a úsáid. Ina áit sin, féadfaidh ceannlínte míreanna a úsáid le tréithe sonracha ranga a chuirtear leo, nó ranna le heilimintí ranga. Is é an chúis a chloiseann go minic mar gheall ar an gcleachtas mícheart seo ná gur mhaith leis an dearthóir "an tslí a fhéachann na ceannteidil". De réir réamhshocraithe, taispeántar ceannteidil i gcló trom agus tá siad níos mó i méid, go háirithe na heilimintí h1 agus h2 a léiríonn i gcló mór i bhfad níos mó ná an chuid eile de théacs an leathanaigh. Coinnigh i gcuimhne gurb é seo ach cuma réamhshocraithe na n-eilimintí seo! Le CSS, is féidir leat breathnú ar cheannteidil a dhéanamh ach is mian leat! Is féidir leat an clómhéid a athrú, bain an cló trom, agus an oiread sin níos mó. Is iad na ceannteidil an bealach cuí chun ceannlínte leathanach a chódáil. Seo a leanas roinnt cúiseanna.

Cén fáth a Úsáidtear Ceannteidil Clibeanna seachas DIVs agus Styling

Innill Chuardaigh Cosúil le Ceannteidil Clibeanna


Is é seo an chúis is fearr chun ceannteidil a úsáid, agus iad a úsáid san ord ceart (.i. H1, ansin h2, ansin h3, etc.). Tugann na hinnill chuardaigh an t-ualú is airde don téacs a chuimsítear taobh istigh de clibeanna ceannteideal toisc go bhfuil luach séimeantach ann don téacs sin. I bhfocail eile, trí lipéadú do theideal leathanach H1, inseoidh tú an t-inneall cuardaigh Spider gurb é sin fócas # 1 an leathanaigh. Tá béim ar # 2 ag ceannteidil H2, agus mar sin de.

Ní gá duit cuimhneamh ar na ranganna a úsáideadh tú chun do chuid Ceannteidil a shainmhíniú

Nuair a bhíonn a fhios agat go mbeidh H1 go bhfuil dochraid, 2em agus buí ag gach leathanach Gréasáin go léir, ansin is féidir leat a shainiú sin aon uair amháin i do bhileog bhileog agus a dhéanamh. 6 mhí ina dhiaidh sin, nuair a chuireann tú leathanach eile, cuirfidh tú tag H1 go barr do leathanach, ní gá duit dul ar ais chuig leathanaigh eile chun a fháil amach cén stíl Aitheantais nó aicme a d'úsáid tú chun na príomhshuímh a shainiú ceannlíne agus fo-cheannairí.

Cuireann siad Amhrán Láidir Láidir ar fáil

Leagann breac-chuntas téacs níos éasca le léamh. Sin an fáth a mhúnaigh na scoileanna is mó sna Stáit Aontaithe mic léinn chun imlíne a scríobh sula scríobhfaidh siad an páipéar. Nuair a úsáideann tú clibeanna ceannteidil i bhformáid imlíne, tá struchtúr soiléir ag do théacs a thagann chun cinn go han-tapa. Ina theannta sin, tá uirlisí ann ar féidir leo imlíne an leathanaigh a athbhreithniú chun achoimre a chur ar fáil, agus braitheann siad seo ar clibeanna ceannteideal don struchtúr imlíne.

Déanfaidh Do Leathanach Sint a Dhéanamh Fíor Leis na Stíleanna Casta Amach

Ní féidir le gach duine bileoga stíl a fheiceáil nó a úsáid (agus tagann sé ar ais go dtí # 1 - amharc ar innill chuardaigh ábhar (téacs) do leathanach, ní na bileoga stíl). Má úsáideann tú clibeanna ceannteidil, tá tú ag déanamh níos inrochtana do na leathanaigh mar go gcuireann na ceannlínte faisnéis ar fáil nach mbeadh tag DIV.

Tá sé úsáideach do Léitheoirí Scáileáin agus d'Inrochtaineacht Láithreán Gréasáin

Cruthaíonn úsáid chuí ceannteidil struchtúr loighciúil le doiciméad. Seo é a dhéanfaidh léitheoirí scáileáin le "léamh" ar shuíomh d'úsáideoir le lagú fís, agus go mbeidh rochtain ag daoine faoi mhíchumas ar do shuíomh.

Stíl téacs agus cló do na ceannlínte

Is é an bealach is éasca chun bogadh amach as an bhfadhb "mór, tromchúiseach agus gránna" clibeanna ceannteideal ná an téacs a stíl ar an mbealach is mian leat breathnú orthu. Go deimhin, nuair a bhíonn mé ag obair ar shuíomh gréasáin nua, de ghnáth, scríobh mé an chéad rud, h1, h2, agus h3 stíleanna an chéad rud. Braitheann mé le teaghlaigh cló agus méid / meáchan díreach. Mar shampla, d'fhéadfadh sé seo a bheith ina réamh-bhileog stíl le haghaidh suíomh nua (is iad seo ach roinnt stíleanna samplaí a d'fhéadfaí a úsáid):

comhlacht, html {corrlach: 0; stuáil: 0; } p {font: 1em Arial, Geneva, Helvetica, sans-serif; } h1 {cló: bold 2em "Times New Roman", Times, serif; } h2 {cló: bold 1.5em "Times New Roman", Times, serif; } h3 {cló: bold 1.2em Arial, Geneva, Helvetica, sans-serif; }

Is féidir leat clónna do cheannlíne a mhodhnú nó an stíl téacs nó fiú an téacs a athrú . Tabharfaidh gach ceann díobh seo an ceannlíne "gránna" isteach i rud éigin níos beoga agus ag teacht le do dhearadh.

h1 {cló: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; imeall: 0; stuáil: 0; dath: # e7ce00; }

Is féidir le Teorainneacha Ceannlínte Gúna Suas

Is bealach iontach iad na teorainneacha chun do chuid ceannlínte a fheabhsú. Agus tá teorainneacha éasca a chur leis. Ach ná déan dearmad triail a bhaint as na teorainneacha - ní gá teorainn a bheith agat ar gach taobh de do cheannlíne. Agus is féidir leat níos mó a úsáid ná teorainneacha simplí leadránach.

h1 {cló: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; imeall: 0; stuáil: 0; dath: # e7ce00; teorainn-barr: soladach # e7ce00 meán; bun na teorann: dotted # e7ce00 tanaí; leithead: 600px; }

Chuir mé teorainn barr agus bun le mo cheannlíne samplach le roinnt stíleanna amhairc spéisiúla a thabhairt isteach. D'fhéadfá teorainneacha a chur ar bhealach ar bith a theastaigh uait an stíl deartha atá uait a bhaint amach.

Cuir Íomhánna Cúlra le do Cheannlínte le haghaidh Pizazz níos mó

Tá cuid de na suímh Ghréasáin ag ceann an leathanaigh a bhfuil ceannlíne ann - de ghnáth teideal an láithreáin agus grafach. Smaoinigh an chuid is mó de na dearthóirí ar seo mar dhá ghné ar leith, ach ní gá duit. Mura bhfuil an grafach ann ach an ceannlíne a mhaisiú, cén fáth nach gcuireann sé leis na stíleanna ceannteidil?

h1 {cló: bold italic 3em / 1em "Times New Roman", "MS Serif", "New York", serif; cúlra: #fff url ("fancyheadline.jpg") ais-x bun; padáil: 0.5em 0 90px 0; téacs-ailíniú: lár; imeall: 0; bun teorann: soladach # e7ce00 0.25em; dath: # e7ce00; }

Is é an cleas leis an gceannlíne seo ná go bhfuil a fhios agam go bhfuil mo íomhá 90 picteilín ar airde. Mar sin, chuir mé greamaithe le bun an ceannlíne 90px (stuáil: 0.5 0 90px 0p;). Is féidir leat imirt leis na corrlaigh, an líne-airde agus an stuáil chun téacs an cheannteidil a fháil chun a thaispeáint go díreach nuair is mian leat é.

Rud amháin le cuimhneamh nuair a bhíonn íomhánna á úsáid agat má tá suíomh gréasáin freagrach agat (ba cheart duit) le leagan amach a athraíonn bunaithe ar mhéideanna agus feistí scáileáin, ní bheidh an ceannlíne i gcónaí an méid céanna i gcónaí. Má theastaíonn uait go mbeadh do cheannlíne mar mhéid cruinn, féadfaidh sé seo fadhbanna a chur faoi deara. Is é ceann de na fáthanna a shealbhaíonn mé íomhánna cúlra i gceannlíne i gcoitinne, chomh fionnuar is féidir leo breathnú ar uaireanta.

Athsholáthar Íomhá i gCeannlínte

Is teicníc tóir eile é seo do dhearthóirí Gréasáin mar go gceadaíonn sé duit ceannlíne grafach a chruthú agus téacs an chlib ceannteidil leis an íomhá sin a chur in ionad. Tá sé seo fíor-fhírinneach go raibh rochtain ag cleachtóirí gréasáin ar bhealaí clúdaithe le beagán clónna agus bhí sé ag iarraidh clónna níos coimhthíocha a úsáid ina gcuid oibre. Tá méadú tagtha ar ardú na gclónna gréasáin i ndáiríre ar conas a dhéantar suíomhanna cur chuige dearthóirí. Is féidir ceannlínte a leagan síos i réimse leathan clónna agus íomhánna leis na clónna sin atá leabaithe nach gá a thuilleadh. Mar sin, ní bhfaighidh tú ach athsholáthair íomhánna CSS le haghaidh ceannlínte ar láithreáin níos sine nach bhfuil nuashonraithe go fóill ar chleachtais níos nua-aimseartha.

Airteagal bunaidh le Jennifer Krynin. Arna eagarthóireacht ag Jeremy Girard ar 9/6/17