web-dev-qa-db-fra.com

Comment styliser une balise d'image dans Ruby on Rails

J'ai une étiquette d'image comme suit:

    <%= image_tag @user.photo.url(:large) %>

Comment puis-je styler une couleur de bordure sur un côté de cette image en CSS? Quel html cela produirait-il?

41
Elias7

Ajoutez une classe ou un identifiant à votre image_tag:

<%= image_tag @user.photo.url(:large), :class => "style_image" %>

Ensuite, utilisez css pour le styler:

.style_image {
  border-right: 1px solid #000;
}
48
DanS

en utilisant l'option "style":

<%= image_tag @user.photo.url(:large), :style => "border: 1px solid red" %>

pour plus d'informations, s'il vous plaît vérifier l'API. 

68

vous pouvez aussi donner un style inline

<%= image_tag @user.photo.url(:large), :style => "float :left;border 1px solid #00000;" %>

Essayez-le .....

13
Kashiftufail

Dans les nouvelles versions de Rails, il existe un "meilleur" moyen:

<%= image_tag('filename_in_public_folder', alt: 'Description', style: 'display: block; margin: auto; width: 40%;')%>
4
Matt

C'est un moyen simple de le faire.

<%= image_tag("example.png", :style => 'border-right: 1px solid #000;')%>
4
Patricia Hung

Si vous utilisez une balise d'image d'une manière différente, vous pouvez toujours y ajouter la classe css, mais sa syntaxe est tout simplement différente. Parfois, vous devez utiliser un serveur externe. (Déploiement sur Heroku? => Amazon s3)

<%= image_tag("https://s3-us-west-2.amazonaws.com/mybucketname/user_photo.png", class: "style_image") %>
2
camdixon

jquery ne change pas l'image. Voici mon script

$(document).ready(function() {
$('img').click(function(e) {
    var newclass = $(this).attr("id");
    var oldclass = $("product_image_container_show image-center").attr('Class');
    $("#product_image_container_show image-center").fadeOut(function(){
        $("#product_image_container_show image-center").removeClass(oldclass).addClass(newclass).fadeIn('slow');
    })
})

});

0
user2602252