开发者

Rails - Inline CSS

开发者 https://www.devze.com 2023-03-24 21:40 出处:网络
So I\'m making a user profile page for my app. However I want the user\'s avatar to have an inset white box-shadow. Therefore using <img /> isn\'t an option since it doesn\'t开发者_StackOverflow

So I'm making a user profile page for my app. However I want the user's avatar to have an inset white box-shadow. Therefore using <img /> isn't an option since it doesn't开发者_StackOverflow support inset shadows (or at least not in Chrome). So instead I'm using a <div> with some inline css to set the image. Here's kinda what I want but of course it wont work.

<div id="avatar" style="background: <%= @person.avatar %>"></div>

Can anyone point me in the right direction for doing this?


Is avatar the actual URL of the image? In that case:

<div id="avatar" style="background-image: url('<%= current_person.avatar %>')"></div>

Make sure that the width and height match the image dimensions in the CSS.


This should work pretty well

<div id="avatar" style="background:url(<%= current_person.avatar %>) no-repeat;" width="<%= User.AVATAR_WIDTH %>" height="<%= User.AVATAR_HEIGHT %>"></div>

User.AVATAR_WIDTH and User.AVATAR_HEIGHT should be defined in your app/models/user.rb as something like:

class User
  AVATAR_WIDTH = 250
  AVATAR_HEIGHT = 250
end
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号