Průhledné bloky
Na našem webu se můžete setkat s mnohými experimentálními funkcemi, tato je ovšem jednoduchá a využívá jen starší CSS.
Dva bloky textu jsou umístěné částečně nad sebe a vrchní je částečně průhledný.
Kód:
<div style="position:relative"><div style="background-color:blue; width: 300px; height: 200px; overflow: hidden">První text</div><div style="position: absolute; left: 150px; top: 100px; opacity: 0.4; background-color: orange; width: 300px; height: 200px; overflow: hidden;">Druhý text</div></div>
Ukázka:
Nunc posuere ante ligula, at blandit lorem adipiscing in. Suspendisse eu posuere velit. Aenean non odio id nunc faucibus mattis at sit amet augue. Duis eu lobortis eros, at pulvinar enim. Nunc congue est rutrum purus ultricies, ac vehicula massa laoreet. Donec ante arcu, interdum nec mi sed, dictum aliquam augue. Fusce nec commodo diam, id sollicitudin odio. Phasellus varius tortor ac urna blandit venenatis.
Nunc ut tempus justo. Cras nec condimentum diam. Etiam eget elit quis erat tincidunt pharetra. Donec metus velit, volutpat sit amet dui at, lacinia fringilla turpis. Fusce vitae auctor lectus. Vestibulum dignissim nunc diam, ut ullamcorper nisl varius nec. Morbi sodales ac purus eget ornare.
