Me pehea te Tango i te Pūtirotiro Taunoa ki te Whakanuihia me te Maehe Matua

Whakamahia nga meka me enei tohutohu

Kei roto i nga tirotiro tukutuku katoa te mea e mohiotia ana hei "ahua kino." He ahua enei e whakaatu ana i te ahua me te waahi o nga huānga HTML i te ngaro o tetahi atu momo whakaahua. Hei tauira, i te nuinga o nga tirotiro katoa, ko te tirohanga taunoa o nga honongaitua ko te tae puru kanapa me te raupapa. Koinei te ahua o enei hononga ki te titiro ki te kore koe e korero ki a raatau kia whakaatu i tetahi huarahi ke.

Ka taea e nga momo tahua taunoa te awhina, engari i roto i te nuinga o nga wa ka hiahia nga kaihoahoa tukutuku ki te tango i enei momo kia taea ai e ratou te tipu hou me nga momo e 100% kei te whakahaere. Ka whakamahia tenei ma te whakamahi i te mea e mohiotia ana ko te "styleheetet rangatira".

Ko te momo styleheet tino pai te waahua tuatahi e karanga ana koe i roto i nga tuhinga katoa. Whakamahia ana e koe he momo waahete mana hei whakakore i nga tautuhinga pūtirotiro taunoa e taea ai e koe te raruraru i te mahere tukutuku-tukutuku. Ina oti i a koe te whakakore i nga momo me te momo tauira ahua, ka timata to hoahoa mai i te wahi kotahi i roto i nga kaitoro katoa - penei ano he peera maeneene mo te peita.

Taunoa Taunoa

Kia tīmatahia te kāhua puka rangatira mā te whakaheke i ngā tawhē, ngā hoe me ngā rohe o te whārangi. Kua taunoa etahi o nga Pūtirotiro Tukutuku i te tinana o te tuhinga ki te 1 ki te 2 nga pika i puta mai i te taha o nga pihanga piira. Ko tenei e tino mohio ana kei te whakaatu katoa ratou:

html, tapahanga tinana: 0px; taraiwa: 0px; rohe: 0px; }

Kei te hiahia hoki koe ki te whakarite i te momotuhi. Me whakarite hoki te rahi o te momotuhi ki te 100 ōrau, 1m rānei, kia wātea ai tō whārangi, engari kei te rite tonu te rahi. A kia tino whakauruhia te raina-teitei.

tinana [font: 1em / 1.25 Arial, Helvetica, kore-serif; }

Whakahōputu Kaupapa

Ko nga upoko matua, ko nga tohu pane (H1, H2, H3, me etahi atu) kaore he taunoa ki te kuputuhi maia me nga taapete nui me te taapatai huri noa ia ratou. Ma te whakakore i te taimaha, nga taapete me te taraiwa, me whakarite kia noho nui ake nga tohu nei (iti atu ranei) i te kuputuhi e karapoti ana ia ratou me te kore he momo atu:

h1, h2, h3, h4, h5, h6 {tapahanga: 0; te papaha: 0; momotuhi-taimaha: noa; momotuhi-whanau: Arial, Helvetica, kore-serif; }

Ka hiahia pea koe ki te whakarite i te rahi o te rahi, te tuhi-reta me te hoe ki o tautuhinga pane, engari e tino okioki ana ki te ahua o te pae e hangaia ana e koe, me waiho i waho o te waahua. Ka taea e koe te whakauru i etahi atu momo mo enei pane ka hiahiatia mo to hoahoa motuhake.

Whakaputu Kupu Kuputuhi

I tua atu i nga upoko, kei reira etahi atu tapanga kuputuhi me tino mohio koe ki te whakakore. Ko tetahi taangata e warewarehia ana e nga tangata ko nga tūtohu pūtau ripanga (TH me TD) me te hanga tūtohu (SELECT, TEXTAREA, me te INPUT). Mena kaore koe e tautuhi i te hunga e rite ana te rahi ki to kuputuhi tinana me to kupu paraka, ka tino miharo koe ki te tuku a nga kaitoro.

p, th, td, li, dd, dt, ul, ol, blockquote, q, acronym, abbr, a, input, select, textarea {tawhito: 0; te papaha: 0; momotuhi: te tikanga noa 1em / 1.25 Arial, Helvetica, kore-serif; }

He pai ano hoki ki te tuku i to korero (BLOCKQUOTE me Q), nga kupu whakatikatika, me nga whakawhitinga he iti ake ano te momo, kia tu ake ai etahi atu:

blockquote {te rahi: 1.25em; te taraiwa: 1.25em} q {te momotuhi-paanui: he awhi; } acronym, abbr {tohu: awhina; raina-raro: 1px tahuna; }

Hononga me Images

He ngawari nga whakahaere ki te whakahaere, ki te whakarereke mai i tera waahanga ataahua kua whakahuahia. E hiahia ana ahau kia mau tonu aku hononga ki raro, engari ki te hiahia koe i tetahi huarahi rereke ka taea e koe te whakarite i enei whiringa motuhake. Kaore hoki ahau i te whakauru i nga tae i roto i te pepa ahua whakapaipai, no te mea ko te tikanga o te hoahoa.

a, a: hono, a: i tae mai, he: kaha, a: hover {whakapaipai kuputuhi: raina; }

Ki nga whakaahua, he mea nui ki te huri i nga rohe. Ahakoa kaore te nuinga o nga kaitoro e whakaatu ana i tetahi rohe e karapoti ana i tetahi ahua whanui, ka honohia te whakapakoko, ka huri nga kaitirotiro i te rohe. Hei whakatika i tenei:

img-rohe: kore; }

Ripanga

Ahakoa kaore e whakamahia ana nga ripanga mo nga kaupapa whakatakotoranga, ka whakamahi tonu pea to pae ki nga raraunga taapua. He pai te whakamahi i nga ripanga HTML. Kua oti kua mohio matou he rite tonu te rahi o nga kuputuhi taapae mo o raatau ripanga, engari he maha atu ano nga momo ka whakatakotoria e koe kia noho tonu nga tepu ki a koe:

tepu ripanga: 0; te papaha: 0; rohe: kahore; }

Puka

Kia rite ki etahi atu huinga, me wehe e koe nga tawhito me nga hoe i runga i o raatau puka. Ko tetahi atu mea e hiahia ana ahau ki te mahi ko te tuhi ano i te tūtohu ingoa hei " tautuhinga " kia kore ai e tapiritia he mokowhiti hou kei hea koe i te tohu i roto i te waehere. Ka rite ki era atu tuhinga kuputuhi, ka tautuhi au i nga korero momotuhi mo te waahanga, te tuhinga me te whakauru ki runga ake, kia rite ano ki te toenga o taku kuputuhi.

puka [te rahi: 0; te papaha: 0; whakaatu: raina; }

He pai ano hoki te whakaaro ki te huri i te kaitohu mo o tapanga. Ka awhina tenei i nga tangata ki te kite i te waahanga e mahi ana i tetahi mea ina pa ana ratou.

taputapu (tohu: tohu; }

Ko nga Whakaritenga Katoa

Mo tenei waahanga o te styleheet rangatira, me tautuhi koe i nga akomanga e whai tikanga ana ki a koe. Koinei etahi o nga akomanga e whakamahia ana e au i nga wa katoa. Kia mahara kaore i whakaturia ki tetahi ahuatanga, na ka taea e koe te tohaina ki nga mea katoa e hiahia ana koe:

.peneke [marama: te rua; } .floatLeft {float: maui; } .floatRight {rererangi: tika; } .LaitaraAunoa {tautuhi-kuputuhi: maui; } .textRight {kuputuhi-tika: tika; } .textCenter {kuputuhi-taurangi: pokapū; } .textJustify {kuputuhi-whakautu: whakatika; } .blockCenter {whakaaturanga: poraka; taha-maui: auto; tawhito-matau: auto; } / * mahara ki te whakarite i te whānui * / .bold {momotuhi-taimaha: maia; } .italic [font-style: italic; } .whakarohia te mea (whakapaipai-kupu); } .noindent {rahi-maui: 0; tarai-maui: 0; } .nomargin {tawhito: 0; } .nopadding {padding: 0; } .nobullet {rārangi rārangi: kahore; tohu-ahua-ahua: kahore; }

Kia mahara, no te mea kua tuhia enei akomanga ki mua i era atu momo kaore ano he waahanga, he maatau ratau ki te whakakore i nga mea waahanga motuhake ake ka puta i muri mai i te waahanga . Mena ka kitea e koe he huinga noa i runga i tetahi kaupapa me te kore e whai mana, me taki koe kia mohio ai kaore he ahua ke atu i roto i tetahi o nga waahanga o muri mai e pa ana ki taua kaupapa.

Ko te Pihanga Matua Matua

/ * Taunoa Taunoa * / html, te waahanga o te tinana: 0px; taraiwa: 0px; rohe: 0px; } tinana [font: 1em / 1.25 Arial, Helvetica, kore-serif; } / * Ngā Tauanga * / h1, h2, h3, h4, h5, h6 {tapahanga: 0; te papaha: 0; momotuhi-taimaha: noa; momotuhi-whanau: Arial, Helvetica, kore-serif; } / * Ngā Tae Kuputuhi * / p, th, td, li, dd, dt, ul, ol, blockquote, q, acronym, abbr, a, input, select, textarea {tawhito: 0; te papaha: 0; momotuhi: te tikanga noa 1em / 1.25 Arial, Helvetica, kore-serif; } blockquote {te rahi: 1.25em; te taraiwa: 1.25em} q {te momotuhi-paanui: he awhi; } acronym, abbr {tohu: awhina; raina-raro: 1px tahuna; } iti [momotuhi-rahi: .85em; } nui {momotuhi-rahi: 1.2em; } / * Hononga me Images * / a, a: hono, a: kua tae mai, he: kaha, a: hover {te whakapaipai kuputuhi: whakahuahua; } img-rohe: kahore; } / * Ripanga * / ripanga te rahi: 0; te papaha: 0; rohe: kahore; } / * Ngā puka / / puka {tapahanga: 0; te papaha: 0; whakaatu: raina; } tapanga {tautuhi: poito; } / * Whakangungu Common * / .clear [clear: both; } .floatLeft {float: maui; } .floatRight {rererangi: tika; } .LaitaraAunoa {tautuhi-kuputuhi: maui; } .textRight {kuputuhi-tika: tika; } .textCenter {kuputuhi-taurangi: pokapū; } .textJustify {kuputuhi-whakautu: whakatika; } .blockCenter {whakaaturanga: poraka; taha-maui: auto; tawhito-matau: auto; } / * mahara ki te whakarite i te whānui * / .bold {momotuhi-taimaha: maia; } .italic [font-style: italic; } .whakarohia te mea (whakapaipai-kupu); } .noindent {rahi-maui: 0; tarai-maui: 0; } .nomargin {tawhito: 0; } .nopadding {padding: 0; } .nobullet {rārangi rārangi: kahore; tohu-ahua-ahua: kahore; }

He tuhinga taketake na Jennifer Krynin. I whakatikahia e Jeremy Girard i te 10/6/17