CSS: lamesa disenyo. mga panig-ingnan sa registration

Paghimo sa mga lamesa uban sa CSS - sa leksyon makapaikag ug responsable. Pamaagi sa negosyo niini nga kinahanglan nga kamaayo, uban sa kahibalo sa tanan nga mga posible nga mga estilo. Dugang pa, kini mao ang gikinahanglan nga sa pagpanag-iya sa usa ka pagbati sa katahum aron dili makapahadlok sa ilang creativity bisita.

Ang lamesa mahimong pagbag-o sa hapit tanan nga mga butang. Matahum nga plano naglakip sa paggamit sa CSS lamesa design utlanan, lamesa background, cell background, ang kal-ang tali kanila ug dugang pa. Tagda ang labing nag-unang mga.

utlanan lamesa

CSS lamesa estilo disenyo sa kanunay naglakip sa usa ka duwa uban sa usa ka utlanan (frame). Ang tanan nga remate lamesa dili contours frame. Nga mao, kini mao nga sama sa 0 pixels. Apan kini mahimong masaway pinaagi sa mga utlanan kabtangan.

Ikaw mahimo hingalan sa gawas nga bayanan alang sa tibuok lamesa:

lamesa {utlanan: 3px lig-on nga itom; }

Salamat sa niini nga linya sa tanan nga mga lamesa sa dapit nga naggamit niini nga estilo mao ang itom nga bayanan. Matikdi nga sa utlanan lamang sa sulab, apan dili sa sulod sa lamesa. Kay linya cell ug frame bungat kon dili.

th, td {utlanan: 3px lig-on nga itom;}

Ang gibag-on ug kolor, nga imong mahimo sa hingalan sa bisan unsa nga. Padayon sa diha sa hunahuna nga ang mga utlanan dili doble sa diha nga ang pagkombinar mga selula.

Ang pulong nagpasabot sa usa ka lig-on nga padayon nga registration. Ikaw mahimo hingalan sa ubang mga prinsipyo.

kini mao ang labing sagad nga gigamit sa lig-on nga bayanan, sama niini tan-awon mas madanihon ug wala makabalda pagtagad gikan sa mga nag-unang unod sa site.

utlanan kabtangan mahimong bungat usab diha sa pisara. utlanan sa lamang nga igalubong alang sa ibabaw, ubos, sa wala o sa too nga kiliran. Tungod kay sa pipila ka mga kaso nga kini dili usa ka mahimo nga kapilian sa mga bayanan alang sa tibuok lamesa sa makausa.

lamesa {utlanan-top: 1px lig-on nga pula nga; }

Busa mahimo gibutang ang frame alang sa tumoy sa lamesa lamang. Susama sa bisan unsa nga lain nga mga partido, sa baylo nga sa lang top isulat: sa tuo, sa wala o ubos.

header lamesa

Lamesa header mahimong bungat sa paggamit sa tag . tag Kini mahimong diha sa CSS sa pagparehistro sa usa ka daghan sa mga kabtangan alang sa lino nga fino nga-tonohon. Ang CSS lamesa design mao ang maayo tungod kay kini mao ang posible nga sa pagmaniobra sa mga elemento sa paagi nga imong gusto.

titulo Kini nga gipakita sa sama nga paagi ingon nga usa ka bandila sa mga libro (sama sa "Talaan 1").

Ikaw mahimo hingalan sa nahimutangan sa mga titulo ug kabtangan kapsiyon-kilid (ibabaw o ubos). Aligning sa wala o sa tuo ang gihubit sa kabtangan text-align.

lamesa background

Background sa lamesa mahimong bisan unsa nga kolor o sumbanan. Kolor nagtakda sa usa ka kabtangan background-kolor. Ang mga ngalan sa mga kabtangan sa bug-os nahiuyon sa gamit sa sinultihan. Kini pasilitar sa pagtago sa daghang mga higayon.

kolor mahimong bungat ingon sa mga ngalan, ug sa lain-laing mga encodings. Dugang pa, nga imong mahimo sa hingalan sa mosunod:

• Transparent - transparent.
• Makapanunod - kolor mao ang sama nga sama sa nga sa ginikanan nga elemento.
• Inisyal - default.

Option sa transparency mahimong gigamit sa mga kaso diin ang tanan nga mga lamesa diha sa teksto sa CSS file nga gihimo sa usa ka kolor, apan sa niini nga kaso walay panginahanglan.

Dugang pa, ang background mahimong usa ka larawan. Sa pagbuhat niini, sa estilo gimando kabtangan background-larawan. dalan mao ang sama niini:

url ( 'URL')

Ang dalan sa file mahimong paryente o bug-os.

Mas komplikado pagkahubog mahimo uban sa usa ka pagdulhog:

• linear-pagdulhog ();
• radyal-pagdulhog ();
• balik-balik nga-linear nga-pagdulhog () ug pagsubli-radyal-pagdulhog () - pagdulhog gisubli.

background cell

Dugang pa sa usa ka background sa kinatibuk-an, nga imong mahimo sa hingalan sa usa ka budlis background sa mga haligi o mga laray nga gihulma. Kay registration sa kabtangan gigamit kaayo sa kanunay, tungod kay ang biswal panagbulag sa mga linya mas sayon sa pagbasa sa impormasyon.

Dugang pa sa mga alternation, ug ikaw hingalan sa gidaghanon sa usa ka partikular nga kolum o laray. Kay sa panig-ingnan nga sama niini:

• tr: ikasiyam-bata (bisan) {...} - hingalan ekis;
• tr: ikasiyam-bata (1) {...} - timailhan sa mga kabtangan sa usa ka partikular nga laray;
• td: ikasiyam-bata (bisan) {...} - usa ka timailhan sa alternating haligi;
• td: ikasiyam-bata (1) {...} - usa ka timailhan sa mga kabtangan sa usa ka partikular nga kolum.

Gawas pa ay ug mga numero mahimong bungat - ang unang (td: una-bata) o katapusan (td: katapusan-bata).

Ang gintang tali sa mga selula

Sa CSS, lamesa design nagtugot kaninyo sa pagtangtang sa mga luna sa taliwala sa mga selula. Pinaagi sa default sila. Pananglitan, kon imong gibutang ang frame sa lamesa sa gawas sa paghimo sa gilay-on sa taliwala sa mga utlanan, kini dinhi niini nga resulta.

Mouyon, kini tan-awon dili kaayo nice ug kini dili sayon sa pagbasa. Users adunay ripple sa mga mata tungod niini. Kuhaa kini nga mga kal mahimong pinaagi sa pagsulat lang sa maong usa ka linya sa estilo lamesa:

utlanan-pagkahugno: pagkahugno

Apan kini usab mahitabo nga ang mga gilay-on, sa sukwahi, kinahanglan nga magadaghan. Dugang pa, ang gidak-on sa mga kal mahimong bungat ingon tali sa mga haligi, ug sa taliwala sa mga linya. Nagpakita nga ang usa ka bili (sa baylo mahugno):

utlanan-pagkahugno: linain nga

Apan ang maong aksyon nga nagpakita nga kini mao ang gikinahanglan aron sa pagbulag sa mga selula. Ingon nga kini mao ang ilang bahin, gipakita sa dugang nga kabtangan:

utlanan-lang-at: 20px.

Kon kamo gusto nga hingalan sa usa ka lain-laing mga gilay-on sa taliwala sa mga laray nga gihulma ug sa mga haligi, nagpakita kini sa duha ka mga butang:

utlanan-lang-at: 10px20px.

Ang kalainan sa mga browsers

Padayon sa diha sa hunahuna nga sa CSS design lamesa mahimong tan-awon lain-laing mga, depende sa browser. Ilabi na sa dili maayo nga mao ang kaso sa mas magulang nga mga bersiyon, nga inobasyon sa CSS dili gisuportahan.

Ang labaw sa usa ka panig-ingnan sa frame gibag-on sa digital nga mga prinsipyo.

Kay sa panig-ingnan niini nga, ang gibag-on sa mga bayanan alang sa mga mabag.

utlanan estilo usab lahi sa hilabihan gayud.

Busa, ang kalamboan sa kanunay tan-awa ang resulta sa lain-laing mga browsers.

Sa CSS design lamesa girekomendar sa pagsusi sa mga matang sa browser. Ilabi dako nga problema nga gigamit sa sa tiggamit uban sa mas magulang nga mga bersyon sa Internet Explorer.

Very abante developers mahimo, depende sa browser sa pagkonektar sa bug-os nga lain-laing mga files CSS. Ug ang usa ka tawo naghimo sa usa ka tseke sa matag o sa pipila ka partikular nga estilo (klase).

Kadaghanan sa mga problema bumangon ka gikan sa mga landong.

CSS: Table format Ehemplo

Registration mahimong na nagkalainlain. Kini ang tanan-agad sa bug-os nga site ug disenyo niini. Ang tanan kinahanglan nga inubanan ug variegated kolor. Usab kini naghimo sa usa ka dakung papel ug palami Developer. Pagbati sa katahum mao ang tanan lain-laing mga.

Kita sa paghatag sa pipila ka mga ehemplo sa mga nagkalain-laing mga lamesa. Ang numero sa ibabaw nagpakita sa paggamit sa kompetisyon ug magdula uban sa kolor background ug sa utlanan.

Daghan ang mahimong makapaikag nga panig-ingnan sa mga maanindot nga neat design nga dili putlon ang mga tiggamit sa mata. larawan Kini mao ang angay nga sa halos sa bisan unsa nga sitwasyon.

Ang sulab mahimong rounded. Kini tan-awon pretty nice.

konklusyon

Samtang kamo mahimo tan-awa, kay ang dagway sa mga lamesa sa CSS adunay daghan nga mga himan. Ang matag sukaranan mao usab ang usa ka dako nga kantidad sa mga kapilian bili. Kon ikaw sa paggamit niini sa tanan nga sa makausa, nga imong mahimo sa paghimo sa mga obra maestra. Ilabi na kon imong buhaton mapaigoigoon design alang sa tanan nga browsers.

Ang nag-unang butang nga diha sa disenyo - dili overdo kini sa mga epekto. Ang tanang butang nga angay nga buhaton sa kasarangang. Sa una, ang layout gusto sa pag-eksperimento, ug paggamit sa ilang tanan nga mga kahibalo diha-diha dayon. Ingon sa usa ka resulta sa sa lamesa mao ang mga oversaturated kabtangan. Sulayi sa paglikay sa niini nga mga mga sayop.

Dugang pa, ang ubang mga lantugi mahimo nga makabalda sa usag usa. Pananglitan, walay panginahanglan sa hingalan sa kolor background sa lamesa, samtang kon may pa gibutang larawan background, nga sapaw sa bungat kolor.