M az ökölszabály arra, hogy a css vagy a html fájl tartalmazza egy adott rész formázását?

CSS fájlok, sőt reszponzívitáshoz külön CSS -ek, és media attribútummal szűrve, mit kell betöltenie.

A <style> elemek nagyon ritkán hasznosak, ha egy egyedi dologról van szó, ami csak azon a lapon érvényesek.

A style="" attribútum pedig csak akkor ha konkrétan egyedi egy elemre szóló formázás, ami a class -tól eltérő, tehát csak egy elemre vonatkozik.

CSS külön.

Style tag a HTML-ben max akkor, ha hirtelen akarok egy picit módosítani egy darab elemen.

Bár később ez nehezíti az átláthatóságot.

Ha valamiert keverned oket es vegyesen hasznalnad, akkor arra figyelj oda, hogy van precedencia a szabalyok kiertekelesekor. Az inline szabaly nagyobb precedenciaju, mint a <style> tagben es a kulon fajlba irt szabalyok.

Szoval ha azt mondod, hogy <div class="wrapper" style="width: 200px"></div>

Majd utana kulon fajlban azt mondod, hogy .wrapper { width: 100px; }

Akkor a dived 200 szeles lesz.

Persze az az ajanlott, hogy a css-t kulon fajlba irjuk.

HTML-be akkor rakunk formázást (CSAK FEJLÉCBE!!!!! inline css-t kerüld el messziről. hosszú távon csak szívás van vele.) tehát akkor írsz fejlécbe ha pl html e-mailt akarsz kiküldeni. Ott a levélbe ágyazott formázást szépen megjeleníti, de pl a gmail webes felülete a távoli fájlokat nem tölti be így a css-t sem fogja. Tehát vannak esetek mikor így használjuk, de normál esetben szinte mindig külön fájlban van.

Sőt. Manapság inkább scss-ben írjuk meg, néha 10-20 fájban is és azt fordítjuk le compiler-el css-re. Tömöríti, oprimalizálja stb... Törekedni kell hogy 1 fájl legyen a végeredmény. Persze ha külön van admin és külön frontend akkor mindegyiknek van 1-1 fájl és mindig azt töltjük be amire épp szükség van, de nem célszerű 20-30 css-t meghívni.