So stylen Sie ein Bild-Tag in Ruby on Rails

Habe ich ein image-tag wie folgt:

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

Wie konnte ich Stil einer Grenze Farbe auf einer Seite des Bildes in CSS? Was html würde, dass produzieren?

Kommentar zu dem Problem
ähnlich wie stackoverflow.com/questions/10136487/... Kommentarautor: Vik

InformationsquelleAutor der Frage Elias7 | 2012-04-17

  1. 43

    Fügen Sie eine Klasse oder id zu Ihrer image_tag:

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

    Dann verwenden css-Formatvorlagen:

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

    InformationsquelleAutor der Antwort DanS

  2. 62

    verwenden Sie die "style" - option:

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

    für weitere Informationen, bitte überprüfen Sie die API.

    InformationsquelleAutor der Antwort Siwei Shen申思维

  3. 13

    können Sie auch inline-style-als auch

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

    Versuchen Sie es.....

    InformationsquelleAutor der Antwort Kashiftufail

  4. 4

    Dies ist ein einfacher Weg, es zu tun.

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

    InformationsquelleAutor der Antwort Patricia Hung

  5. 2

    Für die anderen, die kommen über diese auf Google.
    Wenn Sie ein image-tag auf eine andere Weise, die Sie noch hinzufügen können css-Klasse zu, aber es ist nur eine unterschiedliche syntax. Manchmal müssen Sie mit einem externen server. (Deployment auf Heroku? => Amazon s3)

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

    InformationsquelleAutor der Antwort camdixon

  6. 2

    In neueren Versionen von Schienen, es ist eine "bessere" Art und Weise:

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

    InformationsquelleAutor der Antwort Matt

  7. 0

    jquery ist nicht zu ändern das Bild. Hier ist mein Skript

    $(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');
    })
})

    });

    InformationsquelleAutor der Antwort

Schreibe einen Kommentar