In an image like this, I want to remove the white background but keep the grayness of the dropshadow. Reomving mapping the actual image is not a problem!
This is what I enden up doing instead after lots and lots of trial and error.
Duplicate the layer with the paper in it.
Invert the new layer.
Painting the "paper-part" clear white
Using the inverted layer as a mask on the first layer.
Worked like a charm, perfect masking!
Two options that I can think of:
a) Edit the image in photoshop and make the background transparent.
b) Overlay the "white" background w/ a div overlay that has a white background.
a is the preferred option. Post a comment on this reply if you need me to do this for you.
did you make that image? Why not make the image on a transparent background?
But if you didn't make the image, I don't know if you really can unless you plan on putting it on another whitish background because the dropshadow itself is going to be a little transparent and whatever is underneath it will show through.
Related
I'm currently coding a design mockup into HTMl and I'm trying to figure out the best way to achieve this look responsively. As you see, there's a purple line that stems from the hero CTA button in the bottom right corner. How would I go about changing the line color when it enters the new section; purple to white?
I thought about making two separate lines, but It's difficult to always have them line up right. I wonder if there's some sort of masking trick?
I added a red circle to show the interlacing I'm having issues with.
Screenshot
I am applying a canvas as a texture to a plane. And it looks fine (The background is white by default) if I am displaying it within a browser itself.
But as I change to Virtual Reality Mode the background of the canvas is changing to black.
I know that i can place a white rect to have a white background, but this is not feasible due to performance issues.
Are there any other solutions to tackle this problems?
Thanks!
Try filling in the canvas as white (fillRect), or adding a background to the scene itself (<a-sky color="#FFF">). Let me know if that works, or provide a JSFiddle for us to play around.
I am trying to create HTML Table and give some cells a special border,
you can see the example here - I marked it with Arrow..
Please help me to understand how can I create such border , without using images.
I read this topic, but I could not be able to transfer it to table element or do it as the border of it..
Customizing border properties using zigzag edges
Thanks,
Gabi.
The answer is to use an image as a background to the cell. The image contains the curve and the image could be white and grey, or transparent and grey depending on your use case.
Always try to see what could be there instead of what you think is there
Hi i was going through a website where they used a very unique (according to me) background. they are mixing a color with an image and using it as background. the image is like
Then they are mixing some yellow color in it & it become like this
When i went through the code they were using something like this
background: #f6b93c url(bg1.png);
but it did not work for me!
Please help me out?
That is nothing but a short hand syntax
background: #f6b93c url(bg1.png);
So the above code simply means
background-color: #f6b93c;
background-image: url(bg1.png);
For more info on background short hand syntax
Demo
a png image with transparency and bg color will do the trick,
Otherwise if it is a jpeg,
the color will fill the rest of the part(for eg:in a div), the image wont cover.
what was happening with this background: #f6b93c url(bg1.png);
fill the color #f6b93c then on the top of that place the image, so it was a %0%(for eg.) transparent image, this will end up with a mixer of both
with latest CSS3 technology, it is possible to create texured background. Check this out: http://lea.verou.me/css3patterns/#
but it still limited on so many aspect. And browser support is also not so ready.
your best bet is using small texture image and make repeat to that background. you could get some nice ready to use texture image here:
http://subtlepatterns.com
The image bg1.png does not seem to be in baseurl. You should try relative url. eg. if you have image inside 'images' folder, "images/bg1.png" should work.
I have three background images for a button - left.png, center.png and right.png. The left and right ones have rounded edges and the center one is a single line which need to extend based on the size of the button. How do I create such a button? I have considered the option of constructing the image on the fly and apply it to the button in the resize event, but am looking to see if this is possible through stylesheets. Is this possible?
You can't do it with background-image alone. But it may be done with the help of border-image: http://qt-project.org/doc/qt-4.8/stylesheet-reference.html#border-image
Use background-repeat: repeat-x to fill the button and border-image to round out the edges.
You can do it with QPainter and constructing the image, but honestly for the complexity level and for a button class you might be better off learning how to do it by constructing a paintEvent in full using the standard primitives. It'll give you better fine grain control, just involves a bit of leg work.