Attēla stilizācija ar CSS palīdzību

Lappuse 1 no 1
1

uWM // FORUMS » uWEBMEISTARS // WEBLAPU PLATFORMAS » WEBLAPU PAMĀCĪBAS » uCoz » Attēla stilizācija ar CSS palīdzību

Antikrists

Pirmdiena, 18.12.2017, 2:11:47 | Ieraksts #1

FORUMA APSARGS

Foruma ieraksti: 606

UWM Reputācija:

uWEBMEISTARS ordeņi:

1. līmenis

2. līmenis

3. līmenis

Jaunākie apbalvojumi:

@Antikrists raksta .. :

Code

<div class="uw_nidesam">
<img src="http://bildites.lv/images/dtgmwpdv/94426/original.jpg"width="386" height="352" alt="INFO" />
<span class="vertam"></span>
<span class="kersam"></span>
<span class="bottom"></span>
</div>

<style>.uw_nidesam {
  float:left;
  position:relative;
  overflow:hidden;
}
.uw_nidesam img {
  display:block;
  float:left;
}
.uw_nidesam span.vertam {
  display:block;
  position:absolute;
  top:0;
  left:0;
  width:999px;
  height:999px;
  background:transparent url(http://bildites.lv/images/vj8awk28/94426/original.gif) top left repeat;
}
.uw_nidesam span.kersam {
  display:block;
  position:absolute;
  top:0;
  left:0;
  width:999px;
  height:69px;
  background:transparent url(http://bildites.lv/images/vjvsdkyt/94426/original.png) top left repeat-x;
}
.uw_nidesam span.bottom {
  display:block;
  position:absolute;
  left:0;
  bottom:0;
  width:999px;
  height:95px;
  background:transparent url(http://bildites.lv/images/vwwbmsa6/94426/original.png) bottom left repeat-x;
    }</style>

Ucoz bildes linkā vietā

Code

$IMG_URL1$

Iznākums

Attēls ir palielināts , aptuveni tā izskatīsies.