Question

我有一个图片标签如下：

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

如何在CSS中将边框颜色设置为该图像的一侧？会产生什么样的HTML？

Answer 1

使用“样式”选项：

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

有关详细信息，请查看API。

Answer 2

在image_tag中添加一个类或ID：

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

然后使用css设置样式：

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

Answer 3

您也可以提供内联样式

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

试试.....

Answer 4

这是一种简单的方法。

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

Answer 5

在较新版本的Rails中，有一种“更好”的方式：

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

Answer 6

对于在Google上遇到此问题的其他人。如果您以不同的方式使用图像标记，您仍然可以向其添加css类，但它只是不同的语法。有时您需要使用外部服务器。（在Heroku上部署？=＆gt;亚马逊s3）

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

Answer 7

jquery没有改变图像。这是我的剧本

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

}）;

如何在Ruby on Rails中设置图像标签的样式

7 个答案: