2018. 04. 24.Coppermine | Thumbnails képek méretének változtatása egyszerűen
2018. 04. 18.Videó | PNG készítése Photoshop-ban
2018. 04. 17.Coppermine | Eredeti kép megnyitása új lapon és nem új ablakban
2018. 04. 03.Képről szöveg másolása
2018. 04. 02.Coppermine Galéria költöztetése
Coppermine Gallery themes

Coppermine Gallery themes
81 napja
112 néző

WordPress themes

WordPress themes
82 napja
114 néző

G-Portál themes

G-Portál themes
82 napja
67 néző

Tumblr themes

Tumblr themes
82 napja
101 néző

Képes project szövegdoboz 28.
451 megtekintés

Készítettem a napokban kettő darab projektdobozt, aztán gondoltam el is hozom egyszerre hamar a kettőt, nehogy baj legyen belőle később, mert az sem mindegy, hogy mikor mit frissítek… Egyébként nekem nagyon tetszik mind a kettő doboz. Nem nagy szám egyik sem valóban, de én kódoltam és arra törekedtem, hogy azért egyszerű legyen, hogy bárki tudja használni. Értelemszerűen a doboz méretétől függ, hogy mi hol jelenik meg benne, szóval, ha kisebb vagy nagyobb méretet használtok, mint 380 pixel, akkor ahhoz mérten kell módosítani a margin és padding értékeket is, és a doboz szélességét, ami most 380 pixel.

 

Egyszer volt, hol nem volt

A történet helyszíne egy Maine állambeli tengerparti város, melynek neve Storybrooke. Egy bosszúvágytól elvakult gonosz királynő ebbe a városba száműzte a mesevilág lakóit, megfosztva őket történetük boldog befejezésétől. Storybrooke-ban nem jár az idő, itt a Gonosz királynő hozza a szabályokat…

 

A második projektdoboz itt található meg: Képes project szövegdoboz 27.

 

DIV kód
A perjelek helyére kell másolni az URL címeket.

 

<div id="projektdoboz">
<img src="IDE JÖN A KÉP URL CÍME" style="width:380px;" />
<div class="linkek"><a href="/" target="new">Hivatalos</a><a href="/">Hírek</a><a href="/" target="new">Galéria</a></div>
<div class="cim"><p>PROJEKT CÍME</p></div>
<div class="tartalom">PROJEKT LEÍRÁSA</div>
</div>
</div>

 

CSS kód

 

<style>
#projektdoboz {
width: 380px;
margin: 0 auto;
font-family: Arial;
font-size: 13px;
}
.linkek {
position: absolute;
margin-top: -113px;
margin-left: 15px;
z-index: 1;
}
.linkek a {
font-size: 11px;
font-weight: bold;
text-transform: uppercase;
text-align: center;
letter-spacing: 1px;
text-shadow: 1px 1px 1px rgba(0,0,0, 0.8);
border-left:5px solid #A33F41;
color: #ffffff !important;
text-decoration:none;
padding-left: 5px;
margin-right: 10px;
display: inline-block;
text-decoration: none;
}
.linkek a:hover {
}
.cim {
position: absolute;
margin-top: -80px;
margin-left: 15px;
}
.cim p {
background: rgba(0,0,0, 0.3);
color: #ffffff;
text-shadow: 1px 1px 1px rgba(0,0,0, 0.8);
border: 1px solid #ffffff;
padding: 8px 15px;
}
.tartalom {
color: #000000;
background: #EAEAEA;
text-align: justify;
line-height: 18px;
border: 1px solid #D4D4D4;
padding: 6px;
width: 340px;
margin: 0 auto;
position: relative;
top: -25px;
}
</style>




Előző, következő cikk



Készítettem a napokban kettő darab projektdobozt, aztán gondoltam el is hozom egyszerre hamar a kettőt, nehogy baj legyen belőle később, mert az sem mindegy, hogy mikor mit frissítek… Egyébként nekem nagyon tetszik mind a kettő doboz. Nem nagy szám

Éppen rendelésre készítek egy WordPress kinézetet, ahol kaptam egy linket arról, hogy nagyjából hogyan nézzen ki a téma. Azon az oldalon láttam, hogy egyes kiemelt képek helyén videó jelenik meg. Nagyon megtetszett a dolog és gondoltam megosztom veletek, hogy

 



Hozzászólások