Autor Zpráva
Adrifinel
Profil
Mám:
.kniha{background-image: url(images/kniha.png);float:left;height:725px;width:550px;position:relative; background-repeat:no-repeat;}
.kniha p{font-family:monotype corsiva, fantasy, Garamond, Georgia, Arial, sans-serif;font-size:150%;color:#000;text-indent:1em;margin:3px 25px}
.kniha p1{font-family:monotype corsiva, fantasy, Garamond, Georgia, Arial, sans-serif;font-size:150%;color:#000;text-indent:1em;margin:25px}
.kniha h1{font-family:monotype corsiva, fantasy, Garamond, Georgia, Arial, sans-serif;font-size:250%;color:#000;font-weight:700;text-align:center;font-style:italic;margin:30px}


A v souboru:

<div class="kniha">


A výsledek: http://digitalnimonstra.cz/digimonduskpribeh.php

Obrázek na pozadí se odmítá rozáhnout podle údajů v css, zobrazuje se malej a aby se mi to správně ukazovalo, musím mít velký obrázek nahraný i na serveru, což já bych chtěla spíše malej, aby se nemusel tahat pak ten velký.
ra100
Profil *
Adrifinel:
ak je to veľkosť - height:725px;width:550px obrázku v css, o ktorom hovoríš, skus túto vlastnosť vpísať do
<img src="xyz" width="550" height="725"..... />
....je ale možné, že obrázok stratí kvalitu, preto bude asi lepšie natiahnúť veľký obrázok...
Adrifinel
Profil
ra100:
Jen pár poznámek:
za a) lomítko na konci není vlasnost Transitionalu, který můj web používá...
b) jak ji mám písat, když se jedná o obrázek na pozadí, přes který je text?
c) Fajn, nahraji tam obrázek a zvětším to pomoc html, což je považováno tady za prasárnu, stejně tak jako tahání xx velkých obrázků, ale jak tam dostanu pak ten text. A prosím radu, že mám udělat obrázek s textem ne, chci mít obrázek na pozadí a přes něj text, mám proto svoje důvody.
ra100
Profil *
Adrifinel:
...lomitko na konci není vlasnost Transitionalu, který můj web používá... ano, tvoj je bez lomítka.html 4...
....Jednoduché riešenie je previesť obrázok na veľkosť, ktorú máš uvedenú v css...a je po probléme...
...zvětším to pomoc html, což je považováno tady za prasárnu, stejně tak jako tahání xx velkých obrázku...
- tvoj obrázok je štroktúrovaný, takže o žiadnu prasárnu nejde. ak by bol jednoliaty, jednofarebný, bez štruktúry, v takom prípade by si mohla použiť obrázok napr. -
...width: 550px; height: 1px, background-repeat: repeat-y;
ra100
Profil *
Adrifinel:
A prosím radu, že mám udělat obrázek s textem nechci mít obrázek na pozadí a přes něj text....
Ak som pochopil správne, chceš mať text priamo v obrázku ?
Adrifinel
Profil
ra100:
Prováděla jsem i validaci, takže vím, že lomítko vadí. Pač se to pokládá za vlasnost xhtml.
Jenže, to zase myslíš tahání xxx velkých obrázků ne? Což se ale považuje za prasánu neboť tahání velkých obrázků trvá zbytečně dlouho a kazí to dojem...
Co je štroktúrovaný? Nějak si nejsem jistá jestli rozumím....

A ano, našla jsem si tady na diskuzi, kód jak udělat obrázek, přes který by se psal text. Tudíž mám v css nastylovanej ten obrázek přes který má být text, který mám psanej v souboru.

Když použiji tvůj kod tak se obrázek neopakuje, zůstane furt stejnej....
ra100
Profil *
Adrifinel:
...Co je štroktúrovaný? Nějak si nejsem jistá jestli rozumím....

Sorry-štroktúrovaný = štruktúrovaný = struktura - obrázok má vzhľad starého papiera - štruktúru.
Takže sa asi nevihneš prasárnám s načítaním celého obrazku....
Když použiji tvůj kod tak se obrázek neopakuje, zůstane furt stejnej....
v tvojom pípade, ak chceš zachovať vzhľad obrázku, je táto vlastnosť k ničomu.
Ináč sa to da nahradiť napr. v css
background: #cd853f;
alebo
background-color: #cd853f;

.....
margin
Profil *
Standardně je to dělá tak, že se obrázek rozdělí na tři části, horní, opakujésí se střední část a dolní. Problém u tebe je v tom, že tvůj obrázek knihy k takovému rozdělení není použitelný, bylo by vidět navazující části.
Adrifinel
Profil
ra100:
Takže chceš říct, že css nejde/neumí zvětšovat obrázek podle zadaných rozměrů?
- jenže copak uživatel, když se mu bude xx dlouho načítat, to mi z webu hned odejde...
Ehm ale já nechci barvu pozadí, ale obrázek. Chci aby to vypadalo jako kronika, tedy stará kniha.

margin
Říkala jsem si, jestli někdo nepříjde s tímto řešením...
Tenhle obrázek by byl lepší: http://www.bittbox.com/wp-content/uploads/2008/07/BB_free_texture_11.jpg ?
ra100
Profil *
Adrifinel:

Takže chceš říct, že css nejde/neumí zvětšovat obrázek podle zadaných rozměrů?

...samozrejme že to nejde...
Chci aby to vypadalo jako kronika, tedy stará kniha...
...takže sa nevihneš nadstaveniu veľkosti obrázku na
height:725px;width:550px

ináč to nebude fungovať.
ra100
Profil *
Adrifinel:
...jenže copak uživatel, když se mu bude xx dlouho načítat, to mi z webu hned odejde... -
len dodám, že v editoroch sa dajú upraviť hodnoty obrázku napr. dpi, alebo výstupná kvalita v jpg atd.
Tým môžeš ušetriť kopu bajtov naviše.
ra100
Profil *
Adrifinel:
tvoj obrázok spomínaný v [#9] som upravil na 16,4 kb...čo pri rýchlosti sťahovania - 28 kb bude trvať 7 skúnd...Samozrejme, bral som do úvahy najpomalší net na svete, napr. niekde v bangladéši...dnes sa už s tak pomalým netom normálne asi nestretneš...
ak chceš pošlem ti ho mailom.
margin
Profil *
ra100:
...samozrejme že to nejde...
Samozřejmě, že to jde, ale problém je v tom, že to starší prohlížeče neumí.

Adrifinel:
Tenhle obrázek by byl lepší: ... ?
Ten je ještě horší. Nahoře o pár pixelů je širší, než dole a má bílé okraje.
ra100
Profil *
margin:
Samozřejmě, že to jde, ale problém je v tom, že to starší prohlížeče neumí
Maš pravdu no tvoje riešenie sa opiera o css3. Keďže Adrifinel používa html 4 a validuje ho
asi to nebude to pravé orechové )
margin
Profil *
ra100:
riešenie sa opiera o css3. Keďže Adrifinel používa html 4 a validuje ho asi to nebude to pravé orechové )
Nechápu, co tím chceš říct, HTML validátor se o CSS vůbec nezajímá.
Adrifinel
Profil
ra100:
To by mě zajímalo jak se to to povedlo. Když můj v pf má cca 2 mb a to je v png.
Schválně pošli adrifinel@email.cz jsem zvědavá.
ps. já radši formát png než jpg u webové grafiky.

margin:
Zkusila jsem si s tím vyhrát: http://digitalnimonstra.cz/testt.php
Docela to jde, akorát mi dělá problém napojení horní a prostřední části. Což mi ostatně dělá problém i u prvního obrázku.
Bílé okraje nejsou problém, to řeší průhlednost v png.
O jak starších prohlížečích se tu bavíme? Např. IE 5?
ra100
Profil *
Adrifinel:
ps. já radši formát png než jpg u webové grafiky
png môžeš mať png8 alebo png24...png 8 je podobny gif, png24 je pre vačšie formáty uplne nevhodný, tak, ako napr bmp.
Adrifinel
Profil
ra100:
No myslím, že grafické editory pf, u ps si nejsem jistá používají stardantní png8.
ra100
Profil *
margin:
Nechápu, co tím chceš říct, HTML validátor se o CSS vůbec nezajímá.
yo, asi som stará škola no osobne nemiešam html s xhtml a s css3 atd...)
ra100
Profil *
Adrifinel:
...No myslím, že grafické editory pf, u ps si nejsem jistá používají stardantní png8...
Ak ps znamená photoshop tak ano...
vkaždom prípade je formát png vhodný na talčítka alebo menšie objekty v stránke.
margin
Profil *
ra100:
png24 je pre vačšie formáty uplne nevhodný
Není pravda, jsou případy, třebas barevné přechody, kdy nejlíp vyjde PNG24.
http://teststranek.kvalitne.cz/images/99ccff-ff6666.png - takže klidně i větší objekty.
ra100
Profil *
margin:
yo, onen obrázok má 500px na 500px...
dá sa ale riešiť pomocou
width:500px; height:1px; background-repeat: repeat-y;
..
ra100
Profil *
margin:
png24 je pre vačšie formáty uplne nevhodný
myslel som tým na fotky, ktoré v png dosahujú uctihodných pár mb...)
margin
Profil *
ra100:
dá sa ale riešiť pomocou...
- vyvracel jsem tvé tvrzení o velkých PNG24 obrázcích
- také v případě 1px vysokého obrázku vyjde datově PNG24

myslel som tým na fotky, ktoré v png dosahujú uctihodných pár mb
Konečně se shodneme, až na ty milibajty.
ra100
Profil *
margin:
Konečně se shodneme, až na ty milibajty
yoyo )
Chamurappi
Profil
Reaguji na ra100:
asi som stará škola no osobne nemiešam html s xhtml a s css3 atd...)
Stará škola, která si ještě nevšimla, že nikdy nemělo smysl rozlišovat verze, protože je prohlížeče znají vždy jen jedno HTML a jen jedno CSS.

dá sa ale riešiť pomocou
Opakování malých obrázků (jestli máš na mysli tohle) brzdí vykreslování. Datová úspora při menší velikosti je minimální, takže se vyplatí i jednopixelové pozadí natáhnout tisícinásobně.
Adrifinel
Profil
ra100:
Tak jsem si s tím vyhrála, tamto bylo moc ehm světlé:
http://digitalnimonstra.cz/digimonduskpribeh6.php
Takže... obrázek na pozadí se nestahuje moc dlouho?
Adrifinel
Profil
Chamurappi:
To roztažení hledám... zkusila jsem max-height, ale obrázek to neroztahuje...
ra100
Profil *
Adrifinel:
Takže... obrázek na pozadí se nestahuje moc dlouho?
..ak si použila upravení obrázok, jeho sťahovanie pojde určite rýchlejšie
Adrifinel
Profil
ra100:
Ale chtěla jsem využít vlastnost roztahování obrázků v css a skončila jsem ironicky zase u nahraný obrázku s xx(x) rozměry...no chtěla jsem mít obrázek o rozměrech dejme tomu 120x200, který by se roztáhl a místo toho mám zase 550x990....
Až si někdo při vyhodnocování webu bude stěžovat, proč tam nemám menší obrázek, udělej mi laskavost a vem ho něčím po hlavě...

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0