Bandakisa mpe malako ya bosaleli mpo na mitindo ya bokonzi ya formulaire, ba options ya layout, mpe ba composants personnalisés mpo na kosala ba formulaire ndenge na ndenge.
Botali ya mozindo
Ba contrôles ya formulaire ya Bootstrap epanzani na ba styles na biso ya formulaire Rebooted na ba classes. Salelá bakelasi oyo mpo na kopona na kati ya ba écrans na bango oyo ebongisami mpo na kosala rendu oyo ezali na boyokani mingi na kati ya ba navigateurs mpe ba appareils.
Sala makasi osalela typeattribut oyo ebongi na ba entrées nionso (ndakisa, emailpona adresse email to numberpona ba informations numériques) pona ko profiter na ba contrôles ya sika ya entrée lokola vérification ya email, pona numero, pe ebele.
Tala ndakisa ya mbangu mpo na kolakisa ba styles ya formulaire ya Bootstrap. Koba kotanga mpo na mikanda na ntina ya bakelasi oyo esengeli, ndenge ya kosala formulaire, mpe mingi mosusu.
Ba contrôles ya formulaire
Ba contrôles ya forme textuel —lokola <input>s, <select>s, na <textarea>s —ezali na style na .form-controlclasse. Esangisi ba styles pona apparence générale, état ya focus, sizing, pe ebele.
Mpo na bokotisi ya fisyé, swap the .form-controlfor .form-control-file.
Kosala bonene ya biloko
Botia ba hauteurs na kosalelaka ba classes lokola .form-control-lgna .form-control-sm.
Bobele kotánga
Bakisa readonlyattribut boolean na entrée moko pona kopekisa modification ya valeur ya entrée. Ba entrées ya kotanga kaka emonanaka pete (kaka lokola ba entrées oyo ekangami), kasi batela curseur standard.
Kotánga kaka makomi ya pɛtɛɛ
Soki olingi kozala na ba <input readonly>éléments na formulaire na yo oyo esalemi na style lokola texte ya pamba, salela .form-control-plaintextclasse mpo na kolongola styling ya champ ya formulaire par défaut mpe kobatela marge mpe padding oyo ebongi.
Ba Entrées ya Gamme
Set ba entrées ya gamme oyo ekoki ko défiler horizontalement na nzela ya .form-control-range.
Ba cases ya kotiya bilembo mpe ba radios
Ba cases ya kotiya bilembo ya liboso mpe ba radio ebongisami na lisalisi ya .form-check, kelasi moko mpo na mitindo nyonso mibale ya bokɔti oyo ebongisaka ndenge mpe bizaleli ya biloko na bango ya HTML . Ba case ya kotiya bilembo ezali mpo na kopona option moko to mingi na liste, nzokande ba radios ezali mpo na kopona option moko kati na mingi.
Ba cases ya kotiya elembo mpe ba radio oyo ekangami ezali na lisungi. Attribut disabledekosalela langi ya pete mpo na kosalisa kolakisa état ya entrée.
Ba cases ya kotiya bilembo mpe ba boutons ya radio esalisaka validation ya formulaire oyo esalemi na HTML mpe epesaka ba étiquettes ya mokuse, oyo ekoki kozuama. Lokola yango, <input>s mpe <label>s na biso ezali biloko ya bandeko na bokeseni na oyo ezali na <input>kati ya <label>. Oyo ezali mwa verbose mingi lokola esengeli o préciser idmpe ba forattributs mpo na ko relater na <input>mpe <label>.
Par défaut (ezali ebele) .
Na ndenge ya libela, motángo nyonso ya bakɛsi mpe radio oyo ezali ndeko ya penepene ekozala na esika oyo ebongi mpe ekozala na esika oyo ebongi na .form-check.
Na kati ya molongo
Bosangisi ba cases ya kotiya elembo to ba radios na molongo moko ya horizontal na kobakisa .form-check-inlinena nionso .form-check.
Kozanga ba étiquettes
Bakisa .position-staticna ba entrées na kati .form-checkoyo eza na texte ya étiquette moko te. Kobosana te kopesa naino lolenge moko ya nkombo oyo ekoki kozwama mpo na mayele ya kosalisa (na ndakisa, kosalela aria-label).
Kobongisa
Lokola Bootstrap esalemaka display: blockmpe width: 100%na presque ba contrôles na biso nionso ya formulaire, ba formulaire ekozala par défaut empiler verticalement. Ba kelasi ya kobakisa ekoki kosalelama mpo na kobongola lolenge oyo na kotalela formulaire moko.
Bosala bituluku
Kelasi .form-groupezali lolenge ya pɛtɛɛ ya kobakisa mwa ebongiseli na baformilɛrɛ. Ezali kopesa kelasi ya kobongola oyo elendisaka kosangisa malamu bilembo, bokonzi, makomi ya lisalisi oyo okoki kopona, mpe nsango ya bondimi ya formulaire. Par défaut esalemaka kaka margin-bottom, kasi ezuaka ba styles ya kobakisa na .form-inlinendenge esengeli. Salelá yango elongo na <fieldset>s, <div>s, to pene na eloko mosusu nyonso.
Formulaire ya grille
Ba formulaires plus complexes ekoki kotongama na nzela ya ba classes na biso ya grille. Salelá yango mpo na mabongisi ya baformilɛrɛ oyo esɛngaka makonzí mingi, bonene ndenge na ndenge, mpe banzela mosusu ya kosala boyokani.
Formulaire ya molongo
Okoki mpe ko swap .rowmpo na .form-row, mbongwana ya molongo na biso ya grille standard oyo elongolaka ba gouttières ya colonne par défaut mpo na ba layouts ya makasi mpe ya compact.
Ba layouts ya complexe mingi ekoki pe kosalama na système ya grille.
Forme horizontale
Bosala ba formulaire horizontal na grille na kobakisa .rowclasse na ba groupes ya ba formes mpe kosalela ba .col-*-*classes mpo na kolakisa largeur ya ba étiquettes mpe ba contrôles na yo. Bozala sûr ya kobakisa .col-form-labelna s na bino <label>lokola po bazala verticalement centré na ba contrôles ya formulaire na bango associé.
Na bantango mosusu, mbala mosusu osengeli kosalela ba utilitaires ya marge to ya padding mpo na kosala alignment wana ya kokoka oyo osengeli na yango. Ndakisa, tolongoli padding-topna étiquette na biso ya ba entrées ya radio oyo etandami mpo na ko aligner malamu baseline ya texte.
Taille ya étiquette ya formulaire horizontale
Kobosana te kosalela .col-form-label-smto .col-form-label-lgna <label>s to <legend>s na yo mpo na kolanda malamu bonene ya .form-control-lgmpe .form-control-sm.
Kosala bonene ya makonzí
Ndenge emonisami na bandakisa oyo eleki, système na biso ya grille epesaka yo nzela ya kotya motango nyonso ya .cols na kati ya .rowto .form-row. Bako kabola largeur oyo ezali également entre bango. Okoki mpe kopona mwa ndambo ya makonzí na yo mpo na kozwa esika mingi to moke, nzokande .cols oyo etikali ekabolaka ndenge moko oyo etikali, na bakelasi ya makonzí ya sikisiki lokola .col-7.
Kosala bonene na yango moko
Ndakisa oyo ezali awa na nse esaleli utilitaire flexbox mpo na ko centrer verticalement makambo oyo ezali na kati mpe ebongwanaka .colmpo .col-autoete ba colonne na yo ezwa kaka esika mingi ndenge esengeli. Soki tolobeli yango na ndenge mosusu, makonzí yango ekómaka na bonene na kotalela makambo oyo ezali na kati.
Na sima okoki ko remixer yango mbala moko lisusu na ba classes ya colonne spécifique ya taille.
Salelá .form-inlinekelasi mpo na kolakisa molɔngɔ́ ya bilembo, ba contrôles ya formulaire, mpe ba boutons na molongo moko ya horizontal. Ba contrôles ya formulaire na kati ya ba formulaires inline ekeseni mwa moke na ba états na yango ya défaut.
Ba contrôles ezali display: flex, ko collapser espace blanc HTML nionso mpe ko permettre yo opesa contrôle ya alignment na ba utilitaires ya espacement na flexbox .
Ba contrôles na ba groupes ya entrée bazuaka width: autopona ko superposer défaut ya Bootstrap width: 100%.
Ba contrôles emonanaka kaka na kati ya ligne na ba portes de vue oyo ezali au moins 576px ya largeur pona ko comptabiliser ba portes de vue ya mike na ba appareils mobiles.
Ekoki kozala ete osengeli kotalela na mabɔkɔ bonene mpe boyokani ya ba contrôles ya formulaire mokomoko na ba utilitaires ya espacement (ndenge emonisami awa na nse). Na nsuka, kobosana te kotya ntango nyonso a <label>na contrôle ya formulaire moko na moko, ata soki osengeli kobomba yango mpo na bapaya oyo bazali batangi ya écran te na .sr-only.
Ba contrôles ya formulaire personnalisé na ba selections ezali pe ko soutenir.
Ba alternatives na ba étiquettes oyo ebombami
Ba technologies ya kosunga lokola ba lecteurs ya écran ekozala na problème na ba formulaire na yo soki otie étiquette te pona entrée nionso. Mpo na ba formulaire oyo ya inline, okoki kobomba ba étiquettes na kosalelaka .sr-onlyclasse. Ezali na mayele mosusu ya kopesa elembo mpo na mayele ya kosalisa, na ndakisa aria-label, aria-labelledbyto titleattribut. Soki moko te kati na yango ezali, mayele ya kosunga ekoki kosalela placeholderezaleli yango, soki ezali, kasi yebá ete kosalela yango placeholderlokola esika ya mayele mosusu ya kotya bilembo ezali malamu te.
Mokanda ya lisalisi
Mokanda ya lisalisi ya nivo ya bloc na ba formulaire ekoki kosalama na kosalelaka .form-text(eyebanaki liboso lokola .help-blockna v3). Mokanda ya lisalisi ya kati ya molongo ekoki kosalelama na lolenge ya kobongola na kosalelaka eleman HTML nyonso ya kati ya molongo mpe bakelasi ya utilitaire lokola .text-muted.
Kosangisa makomi ya lisalisi na ba contrôles ya formulaire
Mokanda ya lisalisi esengeli kozala na boyokani ya polele na bokonzi ya formulaire oyo ezali na boyokani na kosalela aria-describedbyattribut. Yango ekosala ete mayele ya kosalisa —na ndakisa batángi ya écran —ekosakola makomi oyo ya lisalisi ntango mosaleli azali kotya likebi to akokɔta na esika oyo batambwisaka yango.
Mokanda ya lisalisi na nse ya bokɔti ekoki kozala na lolenge na .form-text. Kelasi oyo ezali display: blockna mpe ebakisi mwa marge ya likolo mpo na espacement facile uta na ba entrées oyo ezali likolo.
Mot de passe na yo esengeli kozala na bolai ya bilembo 8-20, kozala na balɛtrɛ mpe mituya, mpe esengeli te kozala na bisika, bilembo ya sipesiale, to emoji.
Mokanda ya kati ya molongo ekoki kosalela eloko nyonso ya HTML ya kati ya molongo (ezala <small>, <span>, to eloko mosusu) na eloko mosusu te bobele kelasi ya utilitaire.
Ba formulaire ya ba handicapés
Bobakisa disabledattribut boolean na entrée moko mpo na kopekisa ba interactions ya mosaleli mpe kosala ete emonana pete.
Bakisa disabledattribut na a <fieldset>pona ko désactiver ba contrôles nionso na kati.
Caveat na ba ancres
Ba navigateurs e traité ba contrôles nionso ya forme native ( <input>, <select>, na ba <button>éléments) na kati ya a <fieldset disabled>comme désactivé, epekisaka ba interactions ya clavier na souris na bango.
Kasi, soki formulaire na yo ezali mpe na biloko oyo ezali lokola bouton oyo esalemi na kolanda bamposa na yo lokola <a ... class="btn btn-*">, bakopesa yango kaka lolenge ya pointer-events: none. Ndenge emonisami na eteni oyo elobeli état désactivé mpo na ba boutons (mpe mingimingi na eteni moke mpo na ba éléments ya anchor), propriété oyo ya CSS ezali naino standardisé te mpe esungami mobimba te na Internet Explorer 10. Ba contrôles oyo esalemi na anchor ekozala mpe kaka bongo focusable mpe ekoki kosala na nzela ya clavier. Esengeli o modifier manuellement ba contrôles oyo na kobakisa tabindex="-1"mpo na kopekisa yango kozua focus mpe aria-disabled="disabled"ko signaler état na yango na ba technologies d’assistance.
Bokokani ya navigateur croisé
Atako Bootstrap ekosalela ba styles oyo na ba navigateurs nionso, Internet Explorer 11 mpe na se esimbaka mobimba te disabledattribut na <fieldset>. Salelá JavaScript oyo obongisi mpo na kokanga esika oyo ozali kosala na ba navigateurs oyo.
Bondimisi ya mosala
Pesa makanisi ya motuya, oyo ekoki kosala na basaleli na yo na bondimi ya formulaire HTML5– oyo ezali na ba navigateurs na biso nyonso oyo tosungami . Pona na kati ya ba réactions ya validation par défaut ya navigateur, to salela ba messages personnalisés na ba classes na biso oyo etongami na kati mpe JavaScript ya démarrage.
Toyebi ete na ntango oyo ba styles ya validation personnalisée ya côté client mpe ba toli ya bisaleli ezali accessible te, puisque ezali exposés te na ba technologies ya lisungi. Ntango tozali kosala na solution, tokopesa toli ya kosalela option ya côté serveur to méthode ya validation ya navigateur par défaut.
Validation ya groupe ya entrée
Ba groupes ya entrée bazalaka na difficulté na ba styles ya validation, malheureusement. Recommandation na biso ezali ya kotia ba messages ya retour lokola ba éléments frères ya .input-groupoyo ezali na .is-{valid|invalid}. Kotia ba messages ya ba réactions na kati ya ba groupes ya entrée ebukaka border-radius. Tala likambo oyo ya kosilisa likambo yango .
Ndenge oyo esalaka
Tala ndenge validation ya formulaire esalaka na Bootstrap:
Validation ya formulaire HTML esalemi na nzela ya ba pseudo-classes mibale ya CSS, :invalidmpe :valid. Etaleli <input>, <select>, mpe <textarea>biloko.
Bootstrap esali ba styles ya :invalidmpe :validna classe ya moboti .was-validated, mingi mingi esalelamaka na <form>. Soki te, esika nyonso oyo esengeli kozanga motuya ekolakisama lokola oyo ezali na ntina te na bokɔti ya lokasa. Na ndenge yango, okoki kopona ntango nini okofungola yango (mingimingi nsima ya komeka kotinda formulaire).
Mpo na kozongisa lolenge ya komonana ya formulaire (ndakisa, na likambo ya botindiki ya formulaire dynamique na kosalelaka AJAX), longola .was-validatedkelasi na<form> lisusu nsima ya kotinda.
Lokola fallback, .is-invalidmpe .is-validba classes ekoki kosalelama na esika ya ba pseudo-classes mpo na validation ya côté serveur . Bazali kosɛnga te .was-validatedkelasi ya baboti.
Na tina ya ba contraintes na ndenge CSS esalaka, tokoki te (na tango oyo) kosalela ba styles na a <label>oyo eyaka liboso ya contrôle ya formulaire na DOM sans aide ya JavaScript personnalisé.
Ba navigateurs nionso ya mikolo oyo esungaka API ya validation ya contrainte , série ya ba méthodes ya JavaScript pona ko valider ba contrôles ya formulaire.
Ba messages ya ba réactions ekoki kosalela ba défauts ya navigateur (ekeseni mpo na navigateur moko na moko, mpe ekoki kozala na style te na nzela ya CSS) to ba styles na biso ya ba réactions personnalisés na HTML mpe CSS ya kobakisa.
Okoki kopesa ba messages ya validité personnalisé na setCustomValidityna JavaScript.
Na makanisi wana, talelá ba démonstrations oyo elandi mpo na ba styles na biso ya validation ya formulaire personnalisé, ba classes ya côté serveur oyo okoki kopona, mpe ba défauts ya navigateur.
Ba styles oyo esalemi na kolanda bamposa ya bato
Mpo na ba messages ya validation ya formulaire ya Bootstrap personnalisé, ekosenga obakisa novalidateattribut boolean na <form>. Yango e désactiver ba conseils ya retour par défaut ya navigateur, kasi epesaka kaka accès na ba API ya validation ya formulaire na JavaScript. Meká kotinda formulaire oyo ezali awa na nse; JavaScript na biso ekokanga bouton ya kotinda mpe ekopesa yo makanisi. Ntango ozali komeka kotinda, okomona :invalidmpe :validmitindo oyo esalelami na ba contrôles ya formulaire na yo.
Ba styles ya ba retours personnalisés esalelaka ba couleurs personnalisées, ba frontières, ba styles ya focus, na ba icônes ya fond pona ko communiquer malamu ba réactions. Ba icônes ya fond ya <select>s ezali kaka na .custom-select, mpe te .form-control.
Navigateur ezo défaut
Ozali na mposa te ya ba messages ya rétroaction ya validation personnalisée to kokoma JavaScript mpo na kobongola bizaleli ya formulaire? Nionso bien, okoki kosalela ba défauts ya navigateur. Meká kotinda formulaire oyo ezali awa na nse. Na kotalela navigateur mpe OS na yo, okomona lolenge ya kopesa makanisi oyo ekeseni mwa moke.
Atako ba styles oyo ya ba retours ekoki kozala style na CSS te, okoki kaka ko personnaliser texte ya ba réactions na nzela ya JavaScript.
Côté ya serveur
Tosengi kosalela validation côté client, kasi na cas osengi validation côté serveur, okoki kolakisa ba champs ya formulaire oyo ezali na valeur te mpe oyo ezali valide na .is-invalidmpe .is-valid. Boyeba ete .invalid-feedbackezali mpe kosungama na bakelasi oyo.
Mpo na bisika oyo ezali malamu te, sala ete nsango ya bozongisi makanisi/libunga oyo ezali malamu te ezala na boyokani na esika ya formulaire oyo etali yango na kosalelaka aria-describedby. Attribut oyo epesaka nzela ya idkosala référence koleka moko, na cas oyo champ elakisaka déjà texte ya formulaire ya kobakisa.
Ba éléments oyo esungami
Ba styles ya validation ezali pona ba contrôles ya formulaire na ba composants oyo elandi:
<input>s na <textarea>s na.form-control
<select>s na .form-controlto.custom-select
.form-checks
.custom-checkboxs mpe .custom-radios
.custom-file
Batoli ya bisaleli
Soki bobongisi ya formulaire na yo epesi nzela, okoki kobongola .{valid|invalid}-feedbackbakelasi mpo na .{valid|invalid}-tooltipbakelasi mpo na kolakisa makanisi ya bondimi na lisalisi ya bisaleli oyo ezali na lolenge. Kobosana te kozala na moboti na position: relativelikolo na yango mpo na positionnement ya tooltip. Na ndakisa oyo ezali awa na nse, ba classes na biso ya colonne ezali déjà na oyo, kasi projet na yo ekoki kosenga configuration alternative.
Kosala na ndenge ya moto ye moko
Ba états ya validation ekoki kozala personnalisé via Sass na $form-validation-statescarte. Ezwami na _variables.scssfichier na biso, carte oyo ya Sass ezali na boucle mpo na kobimisa ba états par défaut valid/ invalidvalidation. Ezali na kati ya karte oyo ezali na kati mpo na kosala langi mpe elembo ya etúká mokomoko. Atako ba états mosusu te esungami na ba navigateurs, ba oyo basalelaka ba styles personnalisés bakoki kobakisa na pete ba retours ya formulaire ya complexe mingi.
Svp bo yeba que to recommandé te ko personnaliser ba valeurs oyo sans pe ko modifier form-validation-statemixin.
Solution ya validation ya groupe ya entrée
Tozali na makoki te ya kosilisa oyo ebukani border-radiusya bituluku ya bokɔti na bondimi mpo na bandelo ya moponi, yango wana esengeli kolongolama ya mabɔkɔ. Tango ozali kosalela groupe ya entrée standard mpe ozali ko personnaliser te ba valeurs ya rayon ya frontière par défaut, bakisa .rounded-rightna ba éléments na oyo ebukani border-radius.
@
Svp pona kombo ya mosaleli.
Ntango ozali kosalela etuluku ya bokɔti ya moke to ya monene to kobongisa border-radiusmotuya ya liboso, bakisa CSS ya momeseno na eleman oyo ezali na busted border-radius.
@
Svp pona kombo ya mosaleli.
Baformilɛrɛ oyo esalemi na kolanda bamposa ya bato
Mpo na kosala lisusu mingi mpe kozala na boyokani ya navigateur oyo ekulusu, salelá ba éléments na biso ya formulaire oyo ezali mpenza personnalisé mpo na kozwa esika ya ba défauts ya navigateur. Batongami likolo ya marquage sémantique mpe accessible, yango wana bazali ba remplacements solides mpo na contrôle nionso ya formulaire par défaut.
Ba cases ya kotiya bilembo mpe ba radios
Boîte de coche moko na moko na radio <input>na <label>pairing ezali enveloppé na a <div>pona ko créer contrôle personnalisé na biso. Na structure, oyo ezali ndenge moko na ndenge na biso ya défaut .form-check.
Tosalelaka moponi ya bandeko ( ~) mpo na ba <input>états na biso nyonso —lokola :checked—mpo na kosala malamu elembo ya formulaire na biso ya momesano. Ntango tosangani na .custom-control-labelkelasi, tokoki mpe kosala style ya makomi mpo na eloko moko na moko na kotalela <input>ezalela ya 's.
Tobombaka default <input>na opacitympe tosalelaka .custom-control-labelmpo na kotonga elembo ya sika ya formulaire personnalisé na esika na yango na ::beforempe ::after. Malheureusement tokoki kotonga moko personnalisé te à partir ya kaka ya <input>po CSS's contentesalaka te na élément wana.
Na ba états oyo ba vérifier, tosalelaka ba icônes SVG intégrées base64 à partir ya Open Iconic . Yango epesaka biso contrôle ya malamu koleka mpo na styling mpe positionnement na kati ya ba navigateurs mpe ba appareils.
Ba cases ya kotiya bilembo
Ba cases ya kotiya elembo na ndenge ya moto ye moko ekoki mpe kosalela :indeterminatekelasi ya pseudo ntango etiamaki na maboko na nzela ya JavaScript (ezali na attribut HTML oyo ezali te mpo na kolakisa yango).
Ba cases ya kotiya elembo mpe ba radios personnalisés ekoki mpe kozala désactivé. Bakisa disabledattribut boolean na <input>mpe indicateur personnalisé mpe description ya étiquette ekozala automatiquement styled.
Ba interrupteurs
Commutateur ezali na marquage ya case ya kotiya elembo ya personnalisé kasi esalela .custom-switchclasse mpo na ko rendre commutateur ya toggle. Ba commutateurs pe ezo sunga disabledattribut.
Pona menu
Ba menu personnalisé <select>esengeli kaka na classe personnalisée, .custom-selectpona ko déclencher ba styles personnalisés. Ba styles personnalisés ezali limité na <select>'s appearance ya ebandeli mpe ekoki ko modifier <option>s te mpo na ba limitations ya navigateur.
Okoki mpe kopona kati na ba selects ya mike mpe ya minene oyo esalemi na kolanda bamposa ya moto mpo na kokokana na ba entrées na biso ya makomi ya bonene ya ndenge moko.
Attribut multipleyango mpe esungami:
Ndenge ezali mpe sizeezaleli yango:
Mingi
Bosala ba <input type="range">contrôles personnalisés na .custom-range. Track (fond) mpe thumb (valeur) nyonso mibale ezali na style mpo na komonana ndenge moko na kati ya ba navigateurs. Lokola kaka IE mpe Firefox nde esungaka “kotondisa” piste na bango uta na loboko ya mwasi to na loboko ya mobali ya mosapi monene lokola nzela ya kolakisa na miso bokende liboso, tozali kosunga yango te na ntango oyo.
Ba entrées ya gamme ezali na ba valeurs implicites mpo minna mpe max— 0mpe 100, respectivement. Okoki kolakisa motuya ya sika mpo na baye bazali kosalela bizaleli minmpe max.
Na ndenge ya libela, ba entrées ya range “snap” na ba valeurs ya nombre entier. Mpo na kobongola yango, okoki kolakisa stepmotuya moko. Na ndakisa oyo ezali awa na nse, tozali kobakisa mbala mibale motángo ya matambe na kosaleláká step="0.5".
Navigateur ya ba fichiers
Plugin recommandé pona ko animer entrée ya fichier personnalisé: bs-custom-file-input , yango nde tozali kosalela actuellement awa na docs na biso.
Entrée ya fichier ezali plus gnarly ya bunch mpe esengaka JavaScript ya kobakisa soki olingi ko connecter bango na fonctionnel Pona fichier... mpe texte ya kombo ya fichier oyo oponi.
Tobombaka fichier par défaut <input>via opacitympe na esika na yango style ya <label>. Bouton yango esalemi mpe etyami na esika oyo ezali na ::after. Na nsuka, tozali kosakola a widthmpe heightna <input>mpo na esika oyo ebongi mpo na makambo oyo ezali zingazinga.
Kobongola to kosala ba chaînes na ndenge ya moto ye moko na SCSS
Pseudo :lang()-classe esalelamaka mpo na kopesa nzela na kobongola makomi “Browse” na minɔkɔ mosusu. Bolongola to bobakisa ba entrées na $custom-file-textvariable Sass na balise ya monoko oyo etali yango mpe ba chaînes localisées. Ba cordes ya Anglais ekoki kozala personnalisé ndenge moko. Na ndakisa, talá ndenge moto akoki kobakisa libongoli ya Espagnol (code ya monɔkɔ ya Espagnol ezali es):
Tala lang(es)na action na entrée ya fichier personnalisé pona traduction ya espagnol:
Okozala na posa ya kotiya monoko ya mokanda na yo (to nzete ya moke na yango) malamu mpo ete makomi ya malamu elakisama. Yango ekoki kosalema na kosalelaka attribut langna élément <html>to Content-Languagemotó ya HTTP , kati na mayele mosusu.
Kobongola to kobongisa ba chaînes na HTML
Bootstrap epesaka mpe lolenge ya kobongola makomi ya “Browse” na HTML na data-browseattribut oyo ekoki kobakisa na étiquette ya entrée personnalisé (ndakisa na Néerlandais):