Kodi Mungasinthe Bwanji Maonekedwe a Webusaiti Yanu Ndi CSS?

Zolemba zabwino ndizofunika kwambiri pa webusaitiyi yabwino. CSS imakupatsani ulamuliro waukulu pa maonekedwe a malemba pa intaneti masamba omwe mumapanga. Izi zikuphatikizapo kutha kusintha mtundu wa ma foni omwe mumagwiritsa ntchito.

Mitundu yamitundu ingasinthidwe pogwiritsira ntchito pepala lakunja la kunja , pepala lamkatikati , kapena likhoza kusinthidwa pogwiritsa ntchito mapepala apamtima mkati mwa chilemba cha HTML. Njira zabwino zimalimbikitsa kuti mugwiritse ntchito pepala lakunja la ma CSS yanu. Chipepala chamkati chamkati, zomwe ndizo mafashoni olembedwa mwachindunji mu "mutu" wa chikalata chanu, kawirikawiri amagwiritsidwa ntchito pazitsamba zazing'ono, tsamba limodzi. Makhalidwe apamtima ayenera kupewa chifukwa ali ofanana ndi malemba akale a "font" omwe tachita nawo zaka zambiri zapitazo. Zithunzi zolimbitsa thupi zimapangitsa kuti zikhale zovuta kuyendetsa kalembedwe kazithunzi kuyambira pamene mukufunikira kusintha pazochitika zonse zazithunzi zoyendetsera.

M'nkhaniyi, mutha kusintha momwe mungagwiritsire ntchito mtundu wa fosholo pogwiritsa ntchito pepala lakunja la kunja ndi kalembedwe kamene kamagwiritsidwa ntchito mulemba la ndime. Mungagwiritse ntchito malo omwe mumasewerawa kuti musinthe mtundu wa maonekedwe pa tepi iliyonse yoyandikana, kuphatikizapo chizindikiro cha .

Kuwonjezera Masinthani Kusintha Mtundu Wa Mtundu

Kwa chitsanzo ichi, mungafunikire kukhala ndi chilemba cha HTML cha tsamba lanu ndi fayilo yapadera ya CSS yomwe imamangirizidwa pazomwezo. Tsamba la HTML likhoza kupanga zinthu zingapo mmenemo. Mmodzi yemwe timamudera nkhawa ndi cholinga chake ndi ndime element.

Pano ndi momwe mungasinthire mtundu wa maonekedwe a malemba mkati mwa malemba ndime pogwiritsa ntchito pepala lanu lakunja.

Miyezo yamitundu imatha kufotokozedwa ngati mawu achinsinsi, nambala za mtundu wa RGB, kapena manambala a mtundu wa hexadecimal.

  1. Onjezerani chizindikiro cha kalembedwe pa ndime ya ndime:
    1. p {}
  2. Ikani malo a mtunduyo m'machitidwe. Ikani coloni pambuyo pa katunduyo:
    1. p {mtundu:}
  3. Kenaka yonjezerani mtengo wamtengo wanu pambuyo pa malo. Onetsetsani kuti muthetse mtengo umenewo ndi gawo limodzi:
    1. p {mtundu: wakuda;}

Ndime zomwe zili patsamba lanu zidzakhala zakuda.

Chitsanzo ichi chikugwiritsa ntchito mawu ofunika - "wakuda". Imeneyi ndi njira imodzi yowonjezera mtundu mu CSS, koma imakhala yochepa. Kugwiritsira ntchito mau oti "wakuda" ndi "oyera" kumakhala kosavuta chifukwa mitundu iwiriyi ndi yeniyeni, koma chimachitika ndi chiyani ngati mumagwiritsa ntchito mawu achinsinsi monga "wofiira", "buluu" kapena "wobiriwira"? Kodi mumapeza mthunzi wofiira, wabuluu, kapena wobiriwira? Simungathe kufotokozera kwenikweni mthunzi wa mtundu umene mukufuna ndi mawu achinsinsi. Ichi ndichifukwa chake zikhalidwe za hexadecimal nthawi zambiri zimagwiritsidwa ntchito mmalo mwa mawu achinsinsi.

p {mtundu: # 000000; }}

Ndondomeko iyi ya CSS iwonetsanso mtundu wa ndime yanu kukhala wakuda, chifukwa ndondomeko ya hex ya # 000000 ikutanthauzira wakuda. Mukhoza kugwiritsa ntchito shorthand ndi mtengo wa hex ndikulemba ngati # 000 ndipo mutenga chinthu chomwecho.

Monga tanenera kale, zikhulupiliro za hex zimayenda bwino ngati mukusowa mtundu womwe suli wakuda kapena woyera. Pano pali chitsanzo:

p {mtundu: # 2f5687; }}

Mtengo uwu wa hex ungapangitse ndime kukhala mtundu wa buluu, koma mosiyana ndi mawu ofunikira "blue", chikhomo ichi chimakupatsani mphamvu yodziika mthunzi wa buluu - mwinamwake womwe wopanga amasankha pamene akupanga mawonekedwe webusaitiyi. Pankhani iyi, mtunduwo ukhoza kukhala pakati, mtundu wa buluu.

Pomaliza, mungagwiritse ntchito maonekedwe a RGBA pa mitundu ya maonekedwe. RGCA tsopano ikuthandizidwa m'masakatuli onse amakono, kotero mutha kugwiritsa ntchito mfundo izi popanda kudandaula kuti sizidzathandizidwa mu msakatuli, koma mukhoza kukhazikitsa mosavuta.

p {mtundu: rgba (47,86,135,1); }}

Mtengo uwu wa RGBA ndi wofanana ndi mtundu wa buluu wotchulidwa kale. Makhalidwe atatu oyambirira anaika zikhalidwe za Red, Green, ndi Blue ndipo chiwerengero chomaliza ndicho chiwerengero cha alpha. Ikuyikidwa ku "1", kutanthauza "100%", kotero mtundu uwu sukanakhala wowonetseredwa. Ngati mwaika izo ku chiwerengero cha decimal, monga .85, izo zikhoza kumasulira 85% opacity ndipo mtundu udzakhala wowala pang'ono.

Ngati mukufuna kufotokozera zizindikiro za mtundu wanu, mungachite izi:

p {
Mtundu: # 2f5687;
Mtundu: rgba (47,86,135,1);
}}

Syntax iyi imayika ndondomeko ya hex yoyamba. Icho chimalembanso mtengo umenewo ndi nambala ya RGBA. Izi zikutanthauza kuti msakatuli wamkulu yemwe sagwirizane ndi RGBA akhoza kupeza mtengo woyamba ndikunyalanyaza yachiwiri. Masakono amasiku ano angagwiritse ntchito yachiwiri pa CSS.