background-image

问题 I'm extremely confused why my code won't display the image properly. Here's my code: <style type = "text/css"> #pic { background:url('http://www.tishbi.eu/img/shopping_cart.png') no-repeat; </style> <div id = "pic"> <p> </p> </div> Only a tiny portion of the image is displayed along with the text... I'm so confused why this is happening. The only way I can display the whole image is if I add almost 170px of padding around the image. Someone please help! Thanks. 回答1: You need a closing brace

问题 I'm working on a responsive design that requires the header graphic to scale with the width of the viewport. I've gone for an svg thinking that this would scale well. (I test for svg support in the full site, and replace a gif with the svg). In Firefox (13.0 on Windows 7) it's not antialiasing it at small sizes. It occassionally looks good at some sizes, and does if I fix the dimensions, but I want to avoid doing that. Chrome and Safari do anti-alias the image, and it looks good. I'm setting

问题 I am making a menu that each item has a text like item1, item2 and etc. in hover the background colour changes, text becomes transparent and a background image replaces. I used this code to ease in and out the style. but it only works for background colour and not the image. #nav li:hover { color:transparent !important; text-shadow: none; background-color: rgba(255, 0, 0, .5); -webkit-transition: all 1s ease-in; -moz-transition: all 1s ease-in; -o-transition: all 1s ease-in; -ms-transition:

问题 I know it's repetitious question but I have problem with my code. I have searched stackoverflow and w3schools for a background image setting and wrote the code that was on both sites exactly but still I have problem with the following code. body { background-image: url("C:\Users\mehra\Desktop\Male-Fitness-Models-BAck.jpg"); } or body{ background-image: url("Male-Fitness-Models-BAck.jpg"); } above are the codes I used for setting background, but neither of them work. HTML picture 回答1: If the

问题 I have a background image. I am stretching it so that it fits the entire page.But it is working in browsers other than IE.But if I use background-size, it is working in IE9. But I want it to work in IE8. How to do this? Thanks in advance. In other browsers and in IE9: In IE8: You can find the difference at the bottom of the page. Here is my code: body, html{ height:100%; padding:0; margin:0; } body.BodyBackground { margin: 0px; background: url(../images/common/header/Background_color.png);

问题 I have a background image. I am stretching it so that it fits the entire page.But it is working in browsers other than IE.But if I use background-size, it is working in IE9. But I want it to work in IE8. How to do this? Thanks in advance. In other browsers and in IE9: In IE8: You can find the difference at the bottom of the page. Here is my code: body, html{ height:100%; padding:0; margin:0; } body.BodyBackground { margin: 0px; background: url(../images/common/header/Background_color.png);

问题 What I want to achieve is to put an image in the header, big one, that scales down. I managed how to do it. But also I want content on it - logo, menu, some information. Those elements are in grid boxes. The problem is that image is scaling down but not the content. I want a theme to somehow scale together at the same rate. I want to do it without using the media query. Is it possible or maybe it's a bad practice? Below is the example. I put borders to show what I mean. I set the height to a

问题 Basically: div:hover { body{ background-image:(bg.png); } } This is logical code, I know it does not work, but its the best how I can show you my problem. 回答1: In css ,You can not do this as "body" is parent element to "div" and it should come next to the element hovered to use the for format like firstelement:hover second_element {/*styles*/} you can use jquery to achieve it $("div").hover(function(){ $("body").css("background", "url('url_of_image_here')") }); or javascript elem = document

问题 I want to create "button" in XML layout (if possible) which has background image based on state (this image is NOT 9-patched) and with text. Which component to use? My button_states.xml looks like: <?xml version="1.0" encoding="UTF-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/my_pressed" /> <item android:drawable="@drawable/my_normal" /> </selector> my_pressed and my_normal are NON 9-patched images.

问题 This question already has answers here : Shape with a slanted side (responsive) (3 answers) Closed 4 years ago . I want to be able to create a transparent background using only CSS but with an angle on one end. I've found various ways of trying to do it, but can't quite get it. I don't really want to use any scripting, just CSS. Background image would need to look like this: 回答1: You could do it using borders: http://jsfiddle.net/wNhjb/ #shape { height: 0; width: 80px; border-top: 80px solid