nii CSS ja HTML võimaldavad joonistada ja teha disainitöid, kuigi need tekitavad mõningaid raskusi, kuna need ei ole selleks konkreetseks otstarbeks loodud keeled. CSS on akronüüm, mis pärineb inglise keelest Cascading Style Sheets või Cascading Style Sheets ning on kirjutatud HTML-koodi, et anda veebilehele struktuur ja stiil.
et Õppige CSS-iga joonistama ja HTML-koodi kaudu on oluline omada mõningaid arusaamu selle keele toimimisest, selle piirangutest ja ulatusest. CSS-iga harjutamine on palju nauditavam, kui teete lõbusaid ülesandeid ja mõned asjad on lõbusamad kui kodeerimiskeelt kasutades lahedate kujundite joonistamine ja loomine.
Kuidas CSS-iga HTML-i joonistada?
HTML-is CSS-i abil joonistamise harjutamise alustamiseks tuleb kõigepealt valida pilt, mida kopeerida. Peab olema lihtsad geomeetrilised mõisted. Nii saate kasutada ringe ja ruute, et anda oma kujundusele kuju isegi CSS-i kaudu.
The HTML sildid Need moodustavad kogu veebis kastide komplekti. Seetõttu tulebki alustada põhikonteinerist ja hakata sealt oma loomingut lahti võtma. Mida soovite kujundada? Ühes enimlevinud näites õpetab see ruutude ja ringide abil joonistama armsat ja naljakat karu. Vähemalt alguses läheb asi keerulisemaks.
Kui kavatsete seda teha karu disainNäiteks alustage suurest 500 pikslist ruudukujulisest kastist ja kujundi sees teete joonise. Kast luuakse HTML-märgendi abil, mida tuntakse kui div.
Alustage joonise vaatamist ja analüüsige, kui palju kaste peate looma. Samuti on oluline arvestada, millised karbid milliste kastide sisse lähevad. See protsess võib tunduda veidi kummaline, kui mõelda, kuidas joonistada, kuid see aitab luua korrapärasemat ja selgemat marsruuti. Kasti paigutus peaks olema täielik, et saaksite täieliku ettekujutuse sellest, kui palju kaste teil vaja võib minna.
CSS-is ja HTML-is joonistamiseks määrake eelnevalt värvid
Üks olulisemaid samme rahuldava CSS-i joonistamise tulemuse saavutamiseks on värvide valimine. Selles keeles tähistatakse värve koodidega. Seetõttu peate need juba kindlaks määrama ja kasutama identifitseerimismuutujaid, et seejärel kiiresti õige kood valida. Nii saate hõlpsamini jälgida iga värvi ja seda, millises kastis need asuvad.
Alustage HTML-is CSS-iga loomist ja joonistamist
Temaga jätkates näide karu joonistusest, teeme esimese põhimahuti. Põhipildi järgi peab see olema ringikujuline anum. Selle suuruse määramiseks valime parameetri piiri-raadius 50%. Kui soovite, et karu nägu oleks keskel, kasutage vertikaalse ja horisontaalse telje jaoks paindekäsku ja keskjoondamist.
La pea on ovaalne div kus kõik komponendid asuvad. Sellesse lahtrisse paigutame kõik elemendid klassidega, mis kirjeldavad osi selgesõnaliselt: silm, nina, kõrv, suu. See klasside eristamine aitab lihtsustada igale osale konkreetsete stiilide määramist.
Mõned elemendid kordavad stiili, näiteks silmad ja kõrvad. Seega peate olema konkreetne ja märkima, kas see on vasak silm (silm-vasak) või parem silm (silm-parem). Tehke see vahe iga komponendiga, mis kordab stiili. CSS-i keeles tuleb elementide õigeks positsioneerimiseks ja tuvastamiseks kasutada parameetreid position:relative ja position:absolute. Võime kasutada neid lippe iga CSS-i elemendiga, et asukoht ekraanil oleks alati õige ja täpne. Et kaugused oleksid täpsed, peame mõlema parameetri jaoks kasutama samu kauguse mõõtmisi.
CSS-i ja HTML-iga joonistamine pole lihtne
Muchos Veebidisainerid kasutavad CSS-iga joonistamise võimalust kui viis muuta leht kunstiliseks lõuendiks. Kuid tõsi on see, et ettepanek on üsna keeruline ja tulemused pole kaugeltki parimad. See võib olla alternatiiv konkreetsetes olukordades, kuid see nõuab kõrgemaid teadmisi ja on lõpuks ebapraktiline.
Näiteks tehke lihtsalt ruut. Kus joonistamiseks mõeldud programmid ja keeled võimaldavad teil kujundi luua mõne sekundiga. CSS-is peate iga parameetri keelest kujundama. Niisiis, peate määrama stiili, andma sellele kuju, genereerima laiuse ja pikkuse, sügavuse ja värvid. Seda kõike sõnade ja parameetrite kaudu, mis, kui mitte täiuslikud, annavad teie lehel eksliku tulemuse.
Kuid isegi selle kriitika ja raskuste juures on neid, kes Nad valivad selle oma veebilehtedele graafika tegemiseks. Peate siiski teadma mõnda erinevat CSS-i atribuuti ja funktsiooni, seega olge suurepäraste kunstiteoste loomiseks valmis väikeseks õppimiskõveraks.
Miks joonistada HTML-is CSS-iga?
Tegelik eesmärk selle taga CSS-i joonistamise väljakutse võib olla põhjus, miks jätkad proovimist. Kuigi seda tüüpi keel ei ole mõeldud joonistamise hõlbustamiseks, on see võimalus olemas ja see on elujõuline. Häkkerid ja programmeerijad, kes tunnevad CSS-i väga hästi, otsustavad sageli joonistada ja luua selle meetodi abil kunstiteoseid lihtsalt sellega kaasneva väljakutse tõttu.
Internetist leiate kõikvõimalikke galeriisid, kus on CSS-i abil loodud joonistused. Kui soovite neid samme uuesti proovida või kui soovite lihtsalt lõbutseda ja nende kohta õppida, võite vaadata seda artiklit ja muid soovitusi foorumites ja sotsiaalmeedia ruumides.
Peamised kaalutlused CSS-iga joonistamisel on järgmised:
- Teil pole piiranguid, kuna koodiga joonistamiseks pole reegleid.
- Proovige oma joonist hoida võimalikult väikese koodiga. Nii saate oma veebisaidi jaoks optimaalseid tulemusi.
- Püüdke hoida oma joonisel ainult üks osa.
- Keerukama poole liikumiseks proovige teil mitte olla dive ja kasutada ainult keha.