Il-Funzjonalità tal-Proprjetà CSS border-radius
Il-proprjetà border-radius fis-CSS tikkontrolla l-livell ta' tond fil-kantunieri ta' element viżwali fuq paġna web. Dan il-ġeneratur jippermetti li taġġusta r-roundness tal-kantunieri ta' kaxxa b'mod individwali jew billi tgħaqqadhom flimkien, filwaqt li jagħti l-għażla bejn unitajiet ta' pixels jew perċentwali. Permezz tal-mod ellittiku, huwa possibbli li jinħolqu forom aktar rotob u organiċi billi kull kantuniera tingħata raġġi orizzontali u vertikali separati. Il-kodiċi CSS korrispondenti jiġi ġġenerat istantanjament biex jintuża direttament fid-disinn tiegħek.
Il-ġeneratur jibda b'valur inizjali ta' slider ta' 24, li jipproduċi l-kodiċi border-radius: 24px;. Kull bidla li ssir tiġi riflessa viżwalment fil-preview tal-kaxxa u fil-kodiċi taħt l-intestatura "CSS".
Unitajiet ta' Pixels u Perċentwali f'Responsive Design
L-għażla tal-unità tiddetermina kif l-element iġib ruħu meta jinbidel id-daqs tiegħu fuq skrins differenti:
- Pixels (px): F'din l-unità, il-kantuniera tittundja b'ammont fiss li ma jinbidilx. Jekk element ikollu wisa' ta' 200px jew 500px, ir-raġġ tal-kantuniera jibqa' eżattament l-istess.
- Perċentwal (%): F'din l-unità, il-kantuniera tittundja b'mod relattiv għad-daqs tal-kaxxa nnifisha. Il-perċentwal orizzontali isegwi l-wisa' tal-element, filwaqt li l-perċentwal vertikali isegwi l-għoli tiegħu. Din l-imġiba hija essenzjali għal responsive design fejn il-forom għandhom bżonn jadattaw b'mod proporzjonali għal skrins differenti.
Il-Konfigurazzjoni tal-Kantunieri u l-Mod Ellittiku
L-erba' sliders tal-kantunieri jimmappjaw fid-direzzjoni tal-arloġġ mal-kantunieri tal-kaxxa:
- Fuq nett fuq ix-xellug (top-left)
- Fuq nett fuq il-lemin (top-right)
- Isfel fuq il-lemin (bottom-right)
- Isfel fuq ix-xellug (bottom-left)
Meta l-mod ellittiku jkun mitfi, kull kantuniera tkun kwart ta' ċirku b'raġġ wieħed. Meta tattiva l-għażla "Kantunieri ellittiċi", kull kantuniera tirċievi żewġ sliders separati: wieħed għall-assi Orizzontali u ieħor għall-assi Vertikali.
Din l-istruttura tbiddel il-mod kif jinkiteb il-kodiċi CSS. Meta l-mod ellittiku jkun attiv, il-ġeneratur jikteb il-forma b'żewġ valuri separati bi slash (/). L-ewwel sett ta' valuri jirrappreżenta r-raġġi orizzontali, u t-tieni sett jirrappreżenta r-raġġi vertikali. Meta l-kantunieri jerġgħu jsiru tondi b'raġġ wieħed, il-ġeneratur awtomatikament jerġa' lura għall-forma qasira tal-kodiċi mingħajr slash.
Il-Manwal tal-Inputs u l-Kontrolli
L-interface tal-għodda toffri diversi kontrolli biex jinkiseb id-disinn mixtieq:
| Kontroll / Input | Deskrizzjoni u Funzjoni |
|---|---|
| Sliders | Range ta' 0-100 biex jiġi aġġustat il-livell ta' tond. |
| Il-kantunieri kollha | Slider wieħed li jikkontrolla l-erba' kantunieri f'daqqa meta jkunu magħquda. |
| Sliders Individwali | Erba' sliders separati ("Fuq nett fuq ix-xellug", "Fuq nett fuq il-lemin", "Isfel fuq il-lemin", "Isfel fuq ix-xellug") meta l-kantunieri ma jkunux magħquda. |
| Unità | Selector biex taqleb bejn "px" u "%". |
| Għaqqad il-kantunieri kollha | Toggle biex tattiva jew tiddiżattiva l-kontroll simultanju tal-kantunieri kollha. |
| Kantunieri ellittiċi | Toggle biex tattiva l-mod ellittiku b'raġġi orizzontali u vertikali separati. |
L-Użu ta' Presets għal Forom Mgħaġġla
Il-ġeneratur jinkludi buttuni ta' presets taħt l-intestatura "Presets" biex japplika konfigurazzjonijiet komuni istantanjament:
- Jaqta': Issettja l-kantunieri kollha għal 0, biex b'hekk il-kaxxa jkollha kantunieri li jaqtgħu ta' 90 grad.
- Ittundjat: Japplika tond standard u moderat fuq il-kantunieri kollha.
- Ċirku: Issettja l-kantunieri kollha għal 50% biex jittrasforma kaxxa kwadra f'ċirku perfett.
- Blob: Jattiva l-mod ellittiku b'valuri asimmetriċi biex joħloq forma organika u ratba bħal qatra.
- Weraq: Joħloq forma ta' weraq billi jittundja biss żewġ kantunieri opposti filwaqt li l-oħrajn jibqgħu jaqtgħu.
Proċessar Lokali u Privatezza tad-Data
Kull kantuniera u forma li tiddisinja tiġi ġġenerata u mfassla direttament fil-browser tiegħek. L-ebda data, konfigurazzjoni jew valur li ddaħħal f'din l-għodda ma jiġi mtella' fuq is-servers ta' BroBroGo. Il-proċess kollu jsir lokalment fuq it-tagħmir tiegħek.
Mistoqsijiet Frekwenti (FAQ)
Kif jaħdmu l-erba' kantunieri u d-differenza bejn px u %?
L-erba' sliders jimmappjaw, fid-direzzjoni tal-arloġġ, mal-kantunieri ta' fuq-xellug, fuq-lemin, isfel-lemin u isfel-xellug. F'pixels, kantuniera tittundja b'ammont fiss; f'perċentwal, tittundja relattivament għall-kaxxa — perċentwal orizzontali isegwi l-wisa' u perċentwal vertikali isegwi l-għoli, u b'hekk 50% jibdel kwadru f'ċirku.
X'jagħmel il-mod ellittiku?
Meta jkun mitfi, kull kantuniera tkun kwart ta' ċirku b'raġġ wieħed. Meta tixgħelu, kull kantuniera tirċievi raġġ orizzontali u vertikali separat, ki bih tista' toħloq forom rotob u organiċi bħal "blob". Il-ġeneratur jikteb il-forma b'żewġ valuri separati bi slash għalik, u jerġa' lura għall-forma qasira meta l-kantunieri jerġgħu jsiru tondi.
Kif nista' nagħmel ċirku perfett jew forma ta' pillola?
Għaqqad il-kantunieri, aqleb għal perċentwal u ssettja 50%: kaxxa kwadra ssir ċirku perfett. Għal buttuna f'forma ta' pillola, żomm il-pixels u drag kantuniera lil hinn minn nofs l-għoli tal-buttuna — il-ġnub jibqgħu kompletament ittundjati f'kull wisa'. Il-preset Circle jikkonfigura l-ewwel każ bi klikk waħda.
Kif nista' napplika l-kodiċi ġġenerat fil-proġett tiegħek?
Wara li tkun lestejt l-aġġustamenti kollha tas-sliders u l-forom fil-preview, kull ma trid tagħmel huwa li tikklikkja fuq il-buttuna "Ikkopja s-CSS". Il-kodiċi jiġi kkupjat fil-clipboard tiegħek u tista' tpoġġih direttament fil-fajl CSS tiegħek taħt is-selettur tal-element li tixtieq timmodifika.