-
Technique du blog
Apparence
Changer le thême
Le titre et sous-titre (ci-dessus) correspond à la barre de menu sous eklablog.
Ensuite il faut choisir Ajouter du CSS. Je précise que je ne suis pas un expert du CSS et que le code (ci-dessous) n'engage que moi.
Je le donne à titre d'exemple à chacun de l'adapter à son contexte.
Si vous n'êtes pas capable de déchiffrer ce code CSS, je ne peux être responsable de son utilisation par un tiers..imgCadre02 {
position: relative;
width: 100%;
height: 100%;
background-color: #fff;
box-shadow: 0 10px 15px black, 0 0 50px rgba(0,0,0,0.1) inset;
border-radius: 1% 1% 1% 1% / 1% 1% 1% 1%;
border: 2px solid white;
}
.imgCadre02:before {
position: absolute;
width: 100%;
height: 80%;
border-radius: 10px / 100px;
z-index: -1;
top: 10%;
bottom: 10%;
content: "";
box-shadow: 0 0 15px rgba(0,0,0,0.6);
}
#imgTaille { width:100% height:100% }
#imgCadre01 { padding: 10px 10px 10px 10px; background-color: Teal; }
#txtStyle01 { padding: 10px 10px 10px 10px; font-family: verdana, geneva; font-size: 14pt; }
#txtStyle02 { font-family: verdana, geneva; font-size: 14pt; }Dans la page Photos de mon blog, voici comment j'ai utilisé le CSS afin d'obtenir un cadre autour de la photo.
Les balises html utilisées :
- p avec id="imgCadre01"
- img avec id="imgTaille" class="imgCadre02"
Le résultat :