Je développe une application Ionic 3 et je veux une button
avec un à small add icon
côté de l' image . Cela ressemble à ceci.
Comme la petite icône verte d'ajout à côté de l'image.
Voici mon html ci-dessous pour l'image que j'avais fait.
<ion-col col-4>
<img [src]="image" [hidden]="!image">
<img src="assets/imgs/avatar-placeholder.png" [hidden]="image">
</ion-col>
et le scss
img {
display: block;
border-radius: 100px;
border: 1px solid #fff;
width: 80px;
height: 80px;
margin: 30px auto 0;
box-shadow: 0px 0px 4px rgba(0,0,0,0.7);
margin-top: 0px;
}
Le résultat ci-dessous de mon image.
Je veux juste la petite icône verte d'ajout comme dans la première image.
Apprécier si quelqu'un pourrait aider Merci d'avance.
Utiliser position: absolute
sur l'icône.
Un élément en position absolue est un élément dont la valeur de position calculée est absolue ou fixe.
div {
position: relative;
width: fit-content;
}
div > .icon {
position: absolute;
right: 12px;
bottom: 20px;
width: 50px;
}
<div>
<img src="https://www.esparkinfo.com/wp-content/uploads/2016/08/default-avatar.png" alt="">
<img class="icon" src="https://findicons.com/files/icons/985/affel/128/add.png" alt="">
</div>
Cet article est collecté sur Internet, veuillez indiquer la source lors de la réimpression.
En cas d'infraction, veuillez [email protected] Supprimer.
laisse moi dire quelques mots