Tipas - CSS-gudrybės

Turinys

Tipo parinkiklis (kartais vadinamas Elemento tipo parinkikliu) suderina elementus su atitinkamu elemento mazgo pavadinimu, pvz

, ir žymos. Tipo parinkikliai paprastai naudojami norint pakeisti „plataus brūkšnio“ svetainės stilių.

p ( /* "p" is the type selector */ margin: 0 0 1em 0; )

Bendras naudojimas

Dažnai tipo parinkikliai nustatomi kaip numatytieji, pvz., Iš naujo nustatant CSS, kai ketinama nepaisyti numatytųjų naršyklės nustatymų. Pirmosios normalize.css eilutės pavyzdys, populiarus CSS atstatymas:

article, aside, details, figcaption, figure, footer, header, main, nav, section, summary ( display: block; )

Pirmiau nurodyti tipo parinkikliai nustato, kad tų žymų rodymo ypatybė turi būti blokuojama, todėl bet kada bet kuri iš tų žymų bus naudojama visoje svetainėje, jos bus rodomos kaip blokuojamos, nebent jos būtų perrašytos konkrečiau.

Geriausia praktika

Paprastai laikoma prasta taikyti smulkių detalių pakeitimus tik su tipo parinkikliu. Pavyzdžiui, ypatybės „spalva: balta“ pritaikymas visoms žymoms retai kada bus naudingas bet kurioje svetainėje. Taip yra todėl, kad žymos yra bendrosios ir naudojamos įvairiose svetainėse įvairiems tikslams.

Tačiau naudojant tipo parinkiklį, pvz. body ( ), Nustatant numatytąjį font-size ir line-heighttai yra įprasta. Iš dalies taip yra dėl to, kad bet kuriame puslapyje gali būti tik viena žyma, taigi yra mažiau konfliktų galimybių.

Tipo parinkiklio specifikacija ir našumas

Tipo parinkikliai yra žemiausiame specifiškumo pakopos lygyje (paprastai užrašomi kaip 0, 0, 0, 1), o tai reiškia, kad beveik viskas pakeis stilių, taikomą tik per „Type Selector“, ir pridedant tipo parinkiklį prie klasės ar ID jūsų CSS suteikia minimalų papildomą specifiškumą.

Tipo parinkikliai CSS efektyvumo skalėje taip pat užima žemesnę vietą nei klasės ir ID. Todėl techniškai geriau pasirinkti veikimą naudojant klasę ar ID, o ne bendresnį tipo parinkiklį (nors tikrasis greičio skirtumas paprastai yra nereikšmingas).

Naršyklės palaikymas

„Chrome“ „Safari“ „Firefox“ Opera T.Y „Android“ „iOS“
Bet koks Bet koks Bet koks Bet koks Bet koks Bet koks Bet koks

Įdomios straipsniai...