Yuav Coj Li Cas Siv Cov CSS

Kev nrhiav ib qhov txuas nrog CSS tuaj yeem ua tau ntau txoj hau kev, tab sis peb yuav saib ob txoj hauv qhov URL yuav raug muab zais los ntawm kev saib. Yog tias koj xav tsim ib qho chaw tua tsiaj los yog qe av nkos ntawm koj lub vev xaib, qhov no yog ib txoj kev nthuav tawm kev nkaum.

Thawj txoj kev yog los ntawm kev siv "tsis muaj" raws li tus pointer-txheej xwm tus nqi CSS tus nqi. Qhov thib ob yog los ntawm qhov xim ntawm cov ntawv nyeem kom phim raws li keeb kwm ntawm nplooj ntawv.

Nco ntsoov tias tsis muaj txoj kev yuav ua kom qhov txuas tag ploj los ntawm kev pom thaum tshawb nrhiav qhov chaws. Txawm li cas los xij, cov neeg tuaj xyuas yuav tsis muaj txoj hauv kev yooj yim thiab pom tseeb, thiab cov neeg tuaj xyuas koj tuaj yeem tsis muaj ib qhov cim qhia yuav ua li cas thiaj nrhiav tau qhov txuas.

Lus Cim: Yog tias koj tab tom nrhiav cov lus qhia yuav ua li cas txuas ib daim ntawv qhia sab nraud, cov lus qhia no tsis yog dab tsi koj tom qab. Saib Dab Tsab Ntawv Tshaj Tawm Dab Tsi? xwb.

Txiav kev cuam tshuam cov Pointer Event

Thawj txoj kev uas peb siv los nkaum ib qhov URL yog ua kom qhov txuas tsis muaj dab tsi. Thaum nas hovers dhau qhov txuas, nws yuav tsis qhia dab tsi qhov URL taw rau thiab nws yuav tsis cia koj nias nws.

Sau tus HTML kom raug

Ib qho ntawm nplooj ntawv web site, ua kom paub tseeb tias qhov hyperlink nyeem zoo li no:

ThoughtCo.com

Tau kawg, "https://www.thoughtco.com/" yuav tsum tau taw tes rau qhov tseeb qhov URL uas koj xav tau muab zais, thiab ThoughtCo.com tuaj yeem hloov rau txhua lo lus lossis kab lus uas koj nyiam hais txog qhov txuas.

Tsab cai idea ntawm no yog tias cov chav kawm ntawv yuav tsum siv nrog CSS hauv qab no kom zoo nkaum qhov txuas.

Siv Qhov CSS Code

CSS chaws yuav tsum tau nyob rau hauv chav kawm ntawv thiab piav qhia rau tus browser tias qhov kev tshwm sim raws li qhov txuas tau nyem, yuav tsum yog "tsis muaj," zoo li no:

.active {pointer-events: none; cursor: vim; }

Koj tuaj yeem pom cov qauv no hauv kev nqis tes ua ntawm JSFiddle. Yog tias koj tshem CSS code muaj, thiab mam li rov qab cov ntaub ntawv, qhov txuas dheev ua clickable thiab usable. Qhov no yog vim hais tias thaum CSS tsis siv, qhov txuas tau zoo li qub.

Ceebtoom: Nco ntsoov tias yog tus neeg siv cov nplooj ntawv lub chaws los, lawv yuav pom qhov txuas thiab paub meej qhov twg nws mus vim zoo li peb pom saum toj no, cov cai tseem muaj, nws tsis yog usable.

Hloov cov Txuas & Cov Xim

Feem ntau, tus kws tsim tawm lub web site yuav ua kom sib txawv dua li tus keeb kwm yav dhau los kom cov neeg tuaj saib tau pom tseeb thiab paub tias lawv mus qhov twg. Txawm li cas los, peb nyob ntawm no mus nkaum mus , yog li cia saib yuav hloov cov xim li cas ntawm cov nplooj ntawv.

Txhais kom meej txog Chav Kawm Tshwj Xeeb

Yog tias peb siv tib tus qauv los ntawm thawj txoj hau kev saum toj no, peb tuaj yeem hloov cov chav kawm rau txhua qhov peb xav tau kom tsuas yog kev sib txuas tshwj xeeb raug muab zais.

Yog tias peb tsis siv ib chav kawm ntawv thiab siv qhov CSS hauv qab no mus rau txhua qhov txuas, ces txhua tus yuav ploj mus. Tias 's tsis li cas peb' awm tom qab ntawm no, ces peb 'dhau siv no HTML code uas' s siv cov hoob kawm zes:

ThoughtCo.com

Nrhiav Qhov Xim Xim Siv

Ua ntej peb nkag mus rau CSS qhov tsim nyog kom nkaum qhov txuas, peb yuav tsum paub qhov xim peb xav siv. Yog tias koj muaj keeb kwm yav dhau los lawm, xws li dawb lossis dub, ces qhov ntawd yog qhov yooj yim. Txawm li cas los xij, lwm cov xim tshwj xeeb yuav tsum tau kos thiab.

Piv txwv li, yog tias koj tom qab cov xim muaj ib qho hex nqi ntawm e6ded1 , koj yuav tsum paub hais tias rau CSS chaws ua haujlwm kom zoo rau cov nplooj ntawv koj xav kom nws ploj mus rau hauv.

Muaj ntau ntau cov xim "picker" lossis "eyedropper" muaj, ib qho hu ua ColorPick Eyedropper rau Chrome browser. Siv nws los ua qauv xim tom qab ntawm koj qhov web page kom tau cov xim hex.

Customize tus CSS los hloov cov xim

Tam sim no hais tias koj muaj cov xim uas qhov txuas yuav tsum, nws yog lub sij hawm siv thiab qhov kev cai nqi ntawm cov nqi saum toj no, sau tus CSS code:

.hideme {xim: # e6ded1; }

Yog tias koj cov xim keeb kwm zoo li xim dawb los yog ntsuab, koj tsis tas yuav tsum tau kos npe # ua ntej nws:

.hideme {xim: dawb; }

Saib ntawm no tus qauv code hauv no JSFiddle.