Autor Zpráva
BLASTER22
Profil
#1 · Zasláno: 31. 1. 2006, 17:06:23 · Upravil/a: BLASTER22
Odpovědět Citovat
Místo rámečku obrázek...prosím poraďte jak na to.. děkuji (používam DIV layout a rámečky definovný v CSS)
PerToon
Profil
#2 · Zasláno: 31. 1. 2006, 17:55:17
Odpovědět Citovat
Zkus se kouknout jestli je zde nějaký komplexní řešení, ale v CSS se NEDÁ definovat jako rámeček vlastní obrázek.
Miloš
Profil
#3 · Zasláno: 31. 1. 2006, 20:08:53
Odpovědět Citovat
CSS sice něco jako border-image nezná, ale mohlo by se to dát obejít:

1) Pokud předem znáš rozměry divu, tak mu dát obrázek, který bude tím rámečkem, na pozadí (background-image); tedy gif nebo png – namalovaný okraj a průhledný vnitřek. Takovému divu ale musíš nastavit overflow: hidden; (v horším overflow: scroll;), aby se nezvětšoval a efekt s rámečkoobrázkem nepřišel k úhoně.

Pokud ti bude stačit jen půl rámečku na sousedních stranách (nejspíš vlevo + nahoře), půjde to i při proměnlivé velikosti divu; jen musí být ten obrázek podstatně větší (kvůli různým rozlišením), jenže při velikosti 1800 × 1400 pixelů (což je o něco víc než 1600 ¤ 1200) to může mít katastrofální následek ve velikosti obrázku.

2) vnořené absolutně pozicované divy, každý se svým obrázkem – stranou „rámečku“ na pozadí; nejsem si 100% jistý, jestli by to šlo, respektive šlo-li by to bez vážných problémů a nemám chuť to zkoušet.
Časová prodleva: 3 dny
BLASTER22
Profil
#4 · Zasláno: 3. 2. 2006, 08:40:57
Odpovědět Citovat
hmmm celkem by mi i stačilo takové stínování kolem stránky (jako je třeba na http://www.blueboard.cz ) Ty stránky mají DIV layout a nějak to fachat musí... nevíte jak na to?
Miloš
Profil
#5 · Zasláno: 3. 2. 2006, 09:25:49
Odpovědět Citovat
Ve zkratce to tam mají takhle: 
<head>

  <style type="text-css">

    body {text-align: center;}

    #lahlavni {text-align: left; width:790px; 

        margin-left:auto; margin-right:auto; padding: 0px;

        background: url('pozadi00.gif') repeat-y #fff;}

    #pata{width:790px; height: 10px;

        margin-left:auto; margin-right:auto;

        background: url('pata0000.gif') no-repeat;}

    #labotex {height: 20px; margin: 0px 16px; padding: 7px;

        text-align: center; background: #e8ebee;

        border-top: #c8d1d9 1px solid;}

  </style>  

<body>

<div id="lahlavni">

  <!-- Tady je vlastní obsah stránky -->  

  <div id="labotex">Tady je text paty</div>

</div>

<div id="pata"><!-- Tenhle div musí být prázdný --></div>

</body>

a obrázky na adresách
www.blueboard.cz/gr/pozadi.gif
www.blueboard.cz/gr/pata.gif
Časová prodleva: 18 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0