Autor | Zpráva | ||
---|---|---|---|
lukas zmizik Profil |
#1 · Zasláno: 1. 4. 2012, 22:34:50
kód:
<style> body {background-color: #8CC6F7;} #ram {margin: 0 auto; padding: 10px; background: blue; width: 700px; opacity: .2 } #telo {margin: auto; background: red; width: 500px;} </style> ......... <body> <div id="ram"><div id="telo"> text</div></div> záměr: 1) v "body" bude pozadí nějaká obrázková tapeta 2) div "ram" bude průhledný třeba na 20% - bude to takový průhledný rám 3) a uvnitř toho bude div "telo" , kde bude normální obsah výsledek: vlastnost "opacity" u divu "ram" se přenáší do vnořených divů a to je blbě... půjde to nějak? |
||
dranel91 Profil |
#2 · Zasláno: 1. 4. 2012, 23:31:37
Tuším, že to nepůjde. Budeš muset vymyslet jiné řešení. Zkus nastavit pro div#telo border s rgba, to by mohlo vyhovět tvému záměru.
|
||
Someone Profil |
lukas zmizik:
Nevím přesně jaký je účel, takže nedokážu odhadnout jestli je to vhodný způsob, ale lze to tak nějak splácat i tak, že dáš dva divy pod sebe a jeden přehodíš přes druhý záporným marginem: .div2 {width: 280px; height: 280px; margin: -290px auto 0px auto;} <div class="div1"></div> <div class="div2"></div> Edit: tak to jsem netušil, ani takto to nejde.. jsem zmaten. |
||
lukas zmizik Profil |
#4 · Zasláno: 2. 4. 2012, 00:36:35
jako jediné řešení mne napadlo tohle:
<style> body {background-image: url("pozadi.jpg");} div {margin: 0 auto; width: 990px; } table {padding: 0; width: 990px; } #ram {background-color: black; opacity: .6;} #telo {background-color: blue;} </style> ------------- <body> <div> <table cellpadding="0" cellspacing="0"> <tr height="30px"><td id="ram" colspan="3"></td></tr> <tr><td id="ram" width="10px"><td id="telo"> text <td id="ram" width="10px"></td></tr> <tr height="30px"><td id="ram" colspan="3"></td></tr> </table> Ale nevím nevím, je rok 2012... na druhou stranu, fungovat to funguje, tak co? |
||
Sir Tom Profil |
#5 · Zasláno: 2. 4. 2012, 11:55:29
lukas zmizik:
Vytvoř si v grafickém editoru průhlednější pozadí (png) a ten pak vlož jako pozadi pro #ram. |
||
peta Profil |
#6 · Zasláno: 2. 4. 2012, 13:21:28
Dalo by se to i napozicovat. Ale musis uvazovat opacne. Pruhledne bude sice pod tim, ale fyzicky bude uvnitr :) Pouziji ten someho kod.
<style> .div0, .div1 {width: 300px; height: 300px; margin: 0 auto; position:relative; background: #080;} .div1 {width: 280px; height: 280px; left:10px; top:10px; opacity: 0.5; background: #fc0; position:absolute;} .div2 {width: 260px; height: 260px; left:20px; top:20px; margin: 0 auto; background: #ddd; position:absolute;} </style> <div class="div0"> <div class="div1">pozadi</div> <div class="div2">text</div> </div> |
||
margin Profil * |
#7 · Zasláno: 2. 4. 2012, 14:03:53
peta:
„Dalo by se to i napozicovat.“ Ale jenom tehdy, pokud víš, jak vysoký bude DIV s textem, a se se ve většině případů neví. |
||
peta Profil |
#8 · Zasláno: 3. 4. 2012, 07:27:28
margin: Ze by to resilo height:100%?
|
||
margin Profil * |
#9 · Zasláno: 3. 4. 2012, 07:45:41
peta:
„Ze by to resilo height:100%?“ V tomto případě height:100%; nic neřeší. |
||
Časová prodleva: 12 let
|
0