Autor Zpráva
Falco
Profil
Zajímalo by mne, jestli mohu pomocí CSS stylovat pouze obrázky v jedné velikosti. Tak jako v CSS vyberete např. odstavce "p" aniž byste jim určili třídu:

p {color: red}

Jde to nějak pro obrázky velikosti třeba 100x50px?
například:

img 100x50 {border: none}


Díky všem přispívajícím za názor
gyoja
Profil
Tak jim dej třídu.
V HTML <img class="stovka" src="" />, v CSS .stovka {border:none}

EDIT: Přehlédl jsem to aniž byste jim určili třídu, ale stejně je to přes třídu nejschůdnější.

EDIT2: Jde to i takto img[width="100"] {border:none}, ale nebere to IE6, nevím jak IE7, tohle mám ozkoušeno v Opeře a Firefoxu.
Falco
Profil
gyoja
Ano, přes třídy je to vcelku jednoduché. Ale zajímám se o to, co jsem psal výše. Ušetřilo by to dost času při správě mého webu (kde mám stejně velkých obrázků desítky) a navíc to ušetří i místo v kódu.
Falco
Profil
gyoja
Až teď jsem si všiml tvého "EDIT2" .

Zkouším to ve FF a nejde mi to..
Bubák
Profil
Zkouším to ve FF a Opeře a jde mi to...
Testovaný kód:
<style>
img[width="100"] {border:3px solid red}
img {border:3px solid blue}
</style>
<img src="foto1.jpg" width="100">
<img src="foto1.jpg" width="105">

Dodatek:
Nevím, jestli existuje nějaké řešení pro IE pomocí JS, ale myslím si že by to mohlo jít.
Falco
Profil
Ono to funguje pouze pokud je zadaný i parametr width?
Bez něj mi to totiž nejde.

Pokud to jde jenom s ním, tak je to škoda - protože jestli mám uvést:
<img src="foto1.jpg" width="100">
nebo
<img src="foto1.jpg" class="ikonka">

tak je to vcelku jedno.

Přesto děkuji za příspěvky!
Timy
Profil
Falco
Rozměry obrázku se tak jako tak vyplatí psát přímo do kódu, protože prohlížeč pak pro ně už před načtením vyčlení místo a stránka pak "neskáče", když se dočítají obrázky...
Falco
Profil
Ano Timy, máš pravdu. V mém případě je to ale nepraktické - mám katalog webů, kde je u každého popisu uvedena ikonka - všechny mají stejné rozměry a na celém webu jich mám přes 200. Není zde moc účelné psát ke každé ikonce rozměry.
Díky za názor
gyoja
Profil
Není zde moc účelné psát ke každé ikonce rozměry.
Právě proto bych obrázkům dal class a bylo by to trošku jednodušší než width a height. A 200 obrázků není zase tolik.
Bubák
Profil
Já mám neodbytný dojem, ale neznám konkrétní případ, tak to nemusí být vhodné řešení, že by to mohla řešit kontextová deklarace, něco takového:

<style>
.katalog-webu a img {border: none;}
</style>

<div class="katalog-webu">
<a ...><img ...></a>
<a ...><img ...></a>
</div>

Pokud div, nebo jiný element, se vhodnou třídou dosud neexistuje, tak se přidá.
esemeska
Profil
Bubák
tak to uz je zase rychlejsi psat primo tridy ;)
Dero
Profil
tak to uz je zase rychlejsi psat primo tridy ;)

To je přeci nesmysl. Pokud těch obrázků bude 200 na jednom místě, tak jen na opakování třeba class="nahled" ušetřím 3 kB dat. Účelná práce s kontextem stránky zdobí každého dobrého kodéra.
Falco
Profil
Bubák
Dobrý nápad. Určitě se dá taky dobře využít.

Mně už se to podařilo vyřešit pomocí kombinace prvků v CSS - na webu následuje ikonka vždy za nadpisem (úrovně 2). Zapsal jsem to tedy takto:

HTML:
<h2>Nadpis</h2>
<img>
<p></p>

<h2>Nadpis</h2>
<img>
<p></p>

...

CSS:
h2+img {
border: none;
}
Dero
Profil
Falco: Ale nefunguje to v IE6 a starších, není-liž pravda?
Falco
Profil
Dero máš pravdu. Ono toho v IE nefunguje hodně a přestalo mě bavit to pro tento prohlížeč upravovat.
esemeska
Profil
Dero
ale je to rychlejsi napsat nebo zkopirovat :)
Toto téma je uzamčeno. Odpověď nelze zaslat.

0