Community Tip - Learn all about PTC Community Badges. Engage with PTC and see how many you can earn! X
Hello.
I wonder if it is possible to do CSS styling with pictures. for example this code for styling a popup that I have:
.Popup-Style {
background-color:255,255,255;
border-color: #000000;
color: #FFFFFF;
border-radius: 17px;
opacity: 0.7;
}
This means that the background will be white of the popup. But what I'm thinking of, is it possible to change the background of plain white to a picture instead? (if you have it uploaded in resources) something like:
.Popup-Style {
background-color: /resources/Upload/Awesome_picture.jpg;
border-color: #000000;
color: #FFFFFF;
border-radius: 17px;
opacity: 0.7;
}
Solved! Go to Solution.
Sure, you just have to use the background-image property instead of background-color. See https://developer.mozilla.org/en-US/docs/Web/CSS/background-image for details.
In the URL, you'll want to use something like this:
url(#{$resources}/Uploaded/button_unselected.png);
That will find the image button_unselected.png in your Uploaded resources folder.
Sure, you just have to use the background-image property instead of background-color. See https://developer.mozilla.org/en-US/docs/Web/CSS/background-image for details.
In the URL, you'll want to use something like this:
url(#{$resources}/Uploaded/button_unselected.png);
That will find the image button_unselected.png in your Uploaded resources folder.
Nice,
Worked like a charm, thanks for the help.
Time for some cool user interfaces!
Excellent, have fun!