Yuav Ua Li Cas Los Ua Tus Ncej Ntawm Lub Vev Xaib

Cov txheej txheem:

Yuav Ua Li Cas Los Ua Tus Ncej Ntawm Lub Vev Xaib
Yuav Ua Li Cas Los Ua Tus Ncej Ntawm Lub Vev Xaib

Video: Yuav Ua Li Cas Los Ua Tus Ncej Ntawm Lub Vev Xaib

Video: Yuav Ua Li Cas Los Ua Tus Ncej Ntawm Lub Vev Xaib
Video: Saib Pob Ntseg Qhia Tau Neeg Tus Yam Ntxwv! 2024, Kaum ib hlis
Anonim

Cov thav ntawv tso ib puag ncig cov duab lossis cov ntawv sau kho kom zoo rau thaj chaw thiab ntxiv ntau yam rau nws tsim. Yog tias koj siv cov rooj los tsim cov ciam teb, tom qab ntawd cov cai rau txhua kab yuav coj qhov chaw ntau dhau. Tsis tas li, qhov no, koj yuav tau sau cov HTML code rov qab rau txhua tus ncej. Nrog CSS, koj tuaj yeem yooj yim tsim ib qho ciam teb ntawm txhua cov tuab thiab xim uas koj xav tau los ntawm kev sau ib qho kev cai yooj yim ib zaug rau txhua lub ntsiab lus uas yuav nyob nrog tus ciam teb no. Cov thev naus laus zis no yuav tso cai, yog tias tsim nyog, hloov cov hom thav ntawv ntawm qhov chaw nyob hauv ob peb feeb.

Yuav ua li cas los ua tus ncej ntawm lub vev xaib
Yuav ua li cas los ua tus ncej ntawm lub vev xaib

Nws yog qhov tsim nyog

  • - muaj koj tus kheej lub vev xaib;
  • - paub dab tsi CSS yog thiab qhov twg cov qauv no tau sau rau ntawm lub xaib.

Cov Lus Qhia

Kauj ruam 1

Txhawm rau tsim ciam teb, thawj zaug sau cov cai hauv qab no hauv CSS:

ramka {}

Kauj ruam 2

Txhawm rau kom ciam teb qhov loj me uas koj xav tau, siv ciam-dav ntsuas, uas tsim tau txoj kab ntawm kab dav dav. Piv txwv li, yog hais tias tus ncej kab yuav tsum muaj 3 pixels dav, ces nkag yuav zoo li no:

ramka {ciam teb-dav: 3px;}

Kauj ruam 3

Tam sim no txhais tau cov qauv ntawm tus ciam teb siv ciam teb-ciam teb qhov tseem ceeb. Yog tias koj xav tsim ib qho ciam teb uas nws ob sab yog cov kab xwm tsis tu ncua, tom qab ntawd muab cov kev nkag mus hauv qab no rau hauv cov cai nruab nrab ntawm curly braces - border-style: solid.

Kauj ruam 4

Ciaj ciam teb tuaj yeem tau los ntawm sau ntawv nws zoo li qhov no: ciam teb-style: dotted. Txheeb tus ciam teb-style: dashed yuav muab rau koj ib tug ciam teb.

Kauj ruam 5

Koj tuaj yeem ua tus ciam teb ua ob hom kab zoo li no: ciam teb-style: ob npaug. Siv ciam teb-style: zawj lossis ciam teb-style: caj rau cov kab ntawv lossis cov duab rau hauv ntas nrog cov phiv 3D. Qhov sib txawv ntawm ob txoj kev xaiv no yog tias nyob rau hauv rooj plaub thawj, cov thav duab muaj cov kab uas muaj kab, thiab hauv ob, convex sawv daws yuav.

Kauj Ruam 6

Siv cov cai no: ciam teb-style: inset los tsim cov nyhuv ntawm inset nrog ciam teb ntawm lub xaib. Ua kom cov ntsiab lus ntawm ciam teb, nrog rau ciam teb, ntawm qhov tsis sib haum, convex, sau ciam teb-style: tus qauv pib.

Kauj Ruam 7

Koj tuaj yeem ntxiv cov xim uas xav tau rau lub thav duab uas siv cov ciam ciam-xim tsis tseem ceeb, kuj tso rau ntawm qhov nkhaus nkhaus. Yog tias koj xav ua tus ciam teb liab, ces sau ciam xim: liab, xiav - ciam teb xim: xiav, txiv kab ntxwv - ciam teb xim: txiv kab ntxwv.

Kauj ruam 8

Tus CSS ciam teb chaws, suav nrog txhua txoj kev xaiv, zoo li qhov no:

ramka {ciam teb-dav: 3px; ciam teb-style: khoom; ciam teb-xim: xiav;}

Kauj Ruam 9

Tam sim no, hauv HTML, sau qhov no:

Cov ntsiab lus thav duab Hloov cov kab lus "Cov ncauj lus", ntxig rau cov ntawv sau lossis cov lej ntawm daim duab xav tau.

Kauj ruam 10

Yog li, koj tuaj yeem tsim cov ntsiab lus tsis txwv ntawm lub xaib. Txhawm rau hloov cov duab ntawm tus ncej, koj tsuas yog xav hloov CSS code.

Pom zoo: