CDRN

Formáidigh agus indeantáil CSS

  • Deais
  • Doiciméadú
  • API
formáidíonn do chuid rialacha CSS chun iad a dhéanamh inléite agus intuigthe, ag éascú forbairt agus cothabháil

Cén fáth a n-úsáidtear uirlis formáidithe CSS?

Tá formáidiú cód CSS riachtanach d'fhorbróirí chun cód glan agus inléite a choinneáil. Déanann an uirlis seo an próiseas a shimpliú trí cheadú cód CSS a fhormáidiú go tapa agus go cruinn, rud a fhágann go mbeidh cothabháil agus comhoibriú ar thionscadail níos éasca.

Gnéithe den Uirlis Formáidithe CSS

Ligeann an uirlis formáidithe CSS seo duit cód CSS a chur isteach agus é a fhormáidiú ar mhaithe le hinléiteacht níos fearr. Baineann sé tuairimí, spásanna agus cluaisíní nach bhfuil gá leo, agus cuireann sé eangú cuí le haghaidh rialacha agus airíonna CSS.

Conas an uirlis formáidithe CSS a úsáid

Chun an uirlis formáidithe CSS a úsáid, lean na céimeanna simplí seo:

  1. Cuir isteach do chód CSS sa réimse chuige sin.
  2. Cliceáil an cnaipe “Formataigh”. Formáideoidh an uirlis an cód CSS le go mbeidh sé inléiteach níos fearr.
  3. Cóipeáil an cód CSS formáidithe le húsáid i do thionscadail.

Sampla d’uirlis formáidithe CSS a úsáid

Voici un exemple de code CSS avant et après le formatage : 


Avant le formatage :
comhlacht{font-teaghlach:Arial,sans-serif;dath chúlra:#f0f0f0;margin:0;stuáil:0;}.coimeádán{leithead:80%;margin:0 auto;}.ceanntásc{dath an chúlra:#333;dath:#fff;stuála:20px; téacs-ailíniú:center;

Formáidiú Après le :
comhlacht {
    font-teaghlach: Arial, sans-serif;
    dath an chúlra: #f0f0f0;
    corrlach: 0;
    stuáil: 0;
}

.coimeádán {
    leithead: 80%;
    corrlach: 0 uathoibríoch;
}

. ceanntásc {
    dath an chúlra: #333;
    dath: #fff;
    stuáil: 20px;
    téacs-ailíniú: lár;
}

Ceisteanna coitianta

Cad é an difríocht idir formáidí CSS, mionaitheoir agus álainnitheoir?

Athscríobhann formáidí CSS (nó álainnitheoir) dlúthchomhad go leagan atá eangaithe agus inléite. Déanann mionathraitheoir a mhalairt: baintear spásanna, línte nua agus tuairimí chun méid an chomhaid a sheirbheáiltear sa táirgeadh a laghdú. Díríonn ár n-uirlis ar fhormáidiú: tógann sé bileog CSS mionghearrtha nó claonta go dona agus athfhormáidítear é le eangú comhsheasmhach, réadmhaoin de réir réadmhaoine.

An gcaomhnaíonn an fhormáidiú nótaí tráchta CSS?

Coinnítear na nótaí tráchta /* ... */ mar atá réamhshocraithe. Tá na tráchtanna ceadúnais ag barr an chomhaid (/*! ... */) chomh maith leis na nótaí fóntais (TODO, FIXME) fós slán, ar a líne féin. Más mian leat iad a bhaint chun comhad táirgthe a tháirgeadh, bain úsáid as mionifier tiomnaithe ina ionad sin.

An dtacaítear le réimíreanna díoltóirí (-webkit-, -moz-)?

Tá. Déileáiltear le réimíreanna díoltóirí cosúil le gnáth-airíonna: tá siad eangaithe agus ailínithe leis an gcuid eile den bhloc. Ní ghineann nó ní bhaineann an formáiditheoir réimíreanna: ní dhéanann sé ach an méid a sholáthraítear a fhormáidiú. Chun réimíreanna atá in easnamh a chur leis go huathoibríoch, úsáid Autoprefixer i do phíblíne tógála.

An láimhseálann an formáidí ceisteanna ó na meáin agus rialacha neadaithe?

Tá. Tá @media, @supports, @keyframes agus at-rialacha eile eangaithe lena rialacha atá neadaithe laistigh de na braces. Aithnítear neadú dúchasach CSS (& i riail tuismitheora) freisin agus cruthaítear é i gceart, amhail bloic SCSS nó Lúide atá comhoiriúnach le gnáth-chomhréir CSS.

An féidir liom SCSS, Lúide nó Stylus a fhormáidiú?

Díríonn an uirlis CSS caighdeánach. Ní thuigeann an parsálaí comhréireanna sínte (meascáin SCSS, Lúide athróg le @, comhréir gan braces Stylus) agus is féidir leo toradh díghrádaithe a tháirgeadh. Do na teangacha seo, ina ionad sin, bain úsáid as sass --style=expanded, lessc nó formáidí tiomnaithe ar nós Prettier leis an mbreiseán ceart.

An ndéanann an formáidí an chomhréir CSS a bhailíochtú?

Déanann an formáideoir mionanailís chomhréire: sainaithníonn sé bloic, roghnóirí agus dearbhuithe. Tuairiscíonn sé earráidí comhlána (brace neamhiata, leathstad in easnamh ag deireadh an bhloic) ach ní bhailíochtaíonn sé ainmneacha nó luachanna maoine. Chun bailíochtú iomlán a dhéanamh, bain úsáid as an tseirbhís W3C CSS Validator.

Sampla iarratais

curl -X POST https://cdrn.fr/api/v1/tools/css-formatter/execute \
  -H "Content-Type: application/json" \
  -d '{"input":"..."}'

Scéimre ionchuir

Réimse Cineál Riachtanach Réamhshocrú
input text ✓ –

Críochphointí

  • GET https://cdrn.fr/api/v1/tools - liostaíonn na huirlisí go léir atá ar fáil
  • GET https://cdrn.fr/api/v1/tools/css-formatter - faigh scéimre na huirlise seo
  • POST https://cdrn.fr/api/v1/tools/css-formatter/execute - rith an uirlis seo le pálasta JSON