Komunikace velikosti obrázku, osvědčené postupy
Pokud vyvíjíte dokument html přísně za použití současných osvědčených postupů, jak udržet styling mimo značkování, jak nejlépe komunikovat s velikostí obrázku?
Doporučené postupy v minulosti vyžadují, aby byla výška a šířka obrázku s obrázkem v tom, že se vykreslí rychleji než prohlížeč čekající na stažení obrázku, aby získal jeho rozměry. Zdá se však, že by to porušilo izolační styl z dokumentu.
Ke každému obrázku přidejte atribut id a do css vložte výšku/šířku? To neguje vykreslovací bonus inline výšky a šířky obrázku?
Mít šířku a výšku v prvku IMG není zastaralé a je to určitě nejlepší způsob, jak prohlížeči sdělit šířku a výšku obrázku. Jít ven z cesty, jak to udělat jiným způsobem, je zbytečné a zbytečné (a možná hloupé). Nedělejte zbytečné práce pro sebe ani pro prohlížeč. Držte se základů, které fungují.
Odpověď Johna Conde je na místě. Obrázky mají šířku a výšku - je to součást jejich obsah, nikoli jejich styl. Není tedy třeba provádět „oddělení“.
Jedna výjimka: CSS pro rozměry obrázku je užitečné, pokud máte mnoho obrázků stejné velikosti (např. Miniatury). Zde je mnohem lepší použít třídu CSS k omezení HTML a urychlení vývoje.
Pro design webových stránek včetně tlačítek a ikon je nejlepším řešením CSS sprites.