Szövegdoboz kódja
 

<div align="center">
    <div class="background">
        <div class="transbox">
            <p>
                Színes szövegdoboz CSS kóddal :) Ide jön a szöveg, amit ki szeretnél emelni. Bármilyen hátteret tehetsz bele és a doboz színét is megváltoztathatod. <em>Mindezt a CSS segítségével</em>. Képet is tehetsz bele :) Linket, bármit.<br />
                <a href="/" target="_blank">LindaDesign</a>
            </p>

 

            <p>
                <img alt="" src="/images/scripts/szovegdobozok/006/002.png" style="width: 420px; height: 203px;" />
            </p>

            <p>
                &nbsp;
            </p>
        </div>

        <p>
            &nbsp;
        </p>
    </div>
</div>

CSS kód
 

<style type="text/css">
div.background {
  width:650px; /* doboz szélessége */
  height:100%; /* doboz magassága */
  background:url(/images/scripts/szovegdobozok/006/001.jpg) repeat; /* doboz háttere */
  border:2px solid #FB5799; /* külső keret */
}
div.transbox {
  width:550px; /* belső doboz szélessége */
  height:100%; /* belső doboz magassága */
  margin:30px 50px;
  background-color:#ffffff; /* belső doboz háttér színe */
  border:1px solid #57A6C5; /* belső doboz kerete */
  opacity:0.8;
  filter:alpha(opacity=80); /* For IE8 and earlier */
}
div.transbox p {
  margin:30px 40px;
  font-weight:normal;
  font-family: georgia; /* betűtípus */
  font-size: 13px; /* betűméret */
  color:#000000; /* betűszín */
}</style>

2 539 megtekintés