Block, Element, Modifier (BEM)

Quellen:

http://getbem.com/introduction/

https://sparkbox.com/foundry/bem_by_example


Youtube:

https://www.youtube.com/results?search_query=bam+css


Was ist das, Warum sollte man das nutzen oder was gibt es noch?

BEM ist ein Teil von CSS. Es ist nicht , was man installiert oder einen Library. Das ist etwas ,was man damit, seine css Classes nennt.

BLOCK: Das definiert jeweilige Elemente auf eine Seite. so wie:

  • Logo
  • search
  • Navigation
  • Button
  • Input

Element: Ein Teil eines Blocks, der keine eigenständige Bedeutung hat und semantisch mit seinem Block verbunden ist.

  • Einzelne Punkte in Navigation
  • Einzelne Elemente bei einem Formular

Modifier: Eine Markierung an einem Block oder Element. Verwenden Sie diese, um Aussehen oder Verhalten zu ändern.

  • Farbe
  • Große der schrift

Beispiele:

.block{}

.block--modifier{}

.block__element{}

.block__element--modifier{}


[block]__[element]--[modifier]


Wir freuen uns Sie kennen zu lernen

Hat Sie unser Angebot überzeugt? Dann freuen wir uns, Sie kennen zu lernen. Kontaktieren Sie uns gerne für ein unverbindliches Erstgespräch.

newcubator GmbH
Freie-Vogel-Straße 369
44269 Dortmund
dortmund@newcubator.com
+49 231/586 873 80
newcubator GmbH
Bödekerstraße 22
30161 Hannover
hannover@newcubator.com
+49 511/957 313 00