I have a problem with my background colors. on some pages i use TinySlider, and it sets the background color to grey. And when i try to change it to for example Orange, it will only change on those pages that does not use Tiny Slider. Is there a way to fix this?
I have uploaded the files to google drive. The link for all files
The style.css is for the TinySlider, while the stilark.css is the one that is used for all the pages.
the index.html uses TinySlider, while skolen.html does not.
I hope you can help me.
Try changing the
body {font:12px Verdana,Arial; color:#555; background:#ddd}
of "style.css" into
body {font:12px Verdana,Arial; color:#555; background-color:#FEAD41}
Related
Hi I am new on here first of all nice to meet you all
I am facing a problem on wordpress
I am using "Quick Download Button" Plugin which the link is https://wordpress.org/plugins/quick-download-button/#description
after I have install it on my site I tried to change the button colour by css but I never ever success to change it. I have checked the button in inspect and I copied it but it didn't work.
what I tried was
.g-btn.f-l
{
color: #3c1c1c;
}
but it never worked.
please anyone help will be awsome thanks and sorry for my bad english
Like #jared said - it shouldn't be too hard to find the right selector and change the color within your browsers dev-tools. If you see the color change, bingo! Then if that doesn't work within your css file itself, you might have an ordering issue with your sites css files (i.e. your css is loading before the plugins). Quick way to test this is add the !important selector to that rule on your file - e.g:
color: #3c1c1c !important;
the css color-parameter is not defining the color of the button, but from the text of the button. if you want to change the color of the button, you need to look after "background" or "background-color".
example:
.g-btn.f-l{
color: #FFFFFF;
Background-color: #3c1c1c;
}
Visible example:
Source of example: Kryptonews Lexikon
I'm using the pre-built purple-green angular material pre-built theme with .css. I'd like to use a white background but can't seem to change from the dark grey background. I've tried removing class="mat-app-background" in the body tag of my index.html, but no impact. Do I need to move to .scss to make this change?
Thanks
Pete
element {
background: white !important;
}
If nothing else you have tried works, maybe try this one. It will override all previous styling rules for the specific property.
I'm learning External CSS.
I have a CSS file that is working. The pages use a background image and a content color.
I want to use a different content color as the background for photos--- about 1/2 of the pages in the site. I want it to be in Ext CSS (not a page style), in case I want to change the color in the future.
What is the best practice when everything else in the CSS will be the same for all pages, except for the content color?
Please give a 'grade school' answer telling me exactly what I'll need to do. I'm still learning terminology, so your clarity will really help me.
Thank you.
The best way is use SASS and variables.
Another solution (pure css) is to create a body class to determine your theme.
Example:
<body class="theme1"> or <body class="theme2">
And set your css:
.theme1 .my-div
.theme2 .my-div
With your theme colors
Keep it in this way:
.color1{
color: #000000;}
.color2{
color: #ffffff;}
You can name color1 and color2 as anything you want and save these styles in your css file. Use these classes where you want like:
<button class="color1">Good Button</button>
You can change color values and will reflect everywhere.
I have an SVG background image embedded in a CSS file as a data url:
.what { background: url('data: image/svg+xml; utf8, <svg> ... </svg') }
I want another element to have the same background image, only in a different color, but I don't want to repeat the whole SVG code.
<div class="what one">...</div>
<div class="what two">...</div>
So how do I change the color of a background SVG image?
No Javascript, please.
None of the other related questions answered this, because the solutions given there rely on serving two different files, which I want to avoid because I want to minimize file size for mobile users.
Apparently, as Noah Blon explains, it is possible to style the color of an SVG background image using CSS filters.
An example he gives on his site is:
.icon-blue {
-webkit-filter: hue-rotate(220deg) saturate(5);
filter: hue-rotate(220deg) saturate(5);
}
Please visit his site for more information and two other solutions that do not involve changing the color but SVG background sprites and creating an "inverted" SVG that covers the background and is transparent where the background color shines through to create a colored form.
Unfortunately, IE does not support filters.
You can't restyle the contents of a background image with CSS. It doesn't matter if it's an external SVG, or one applied as a Data URI.
Check out this webpage: https://css-tricks.com/using-svg/
Part way down the page is a header called "Now you can control with CSS!"
They appear to be changing the color of the image inline with statements such as
.kiwi {
fill: #94d31b;
}
I am using Wordpress template Simple market and the default text colour is green but I want to change it to black. Even the widgets I install go green. Is there a way to change the whole color rather than changing it in css one by one?
You can put some CSS in your theme's style.css file to override its green text-color with black text-color, for example:
body {
color: black;
}
if the above not work, try something like:
body {
color: black !important;
}
This is just a quick patch but not a final solution. When your have better understanding in the theme you mentioned, you can use some tools like Firebug to locate the actual CSS codes and to search and replace them in style.css file which they belong to. That will be better.
Go to Style.css
replace green color(you will find it using colorpix) to black(i.e #000000) using find and replace feature in any stylesheet editor.
Simple enough and no other way.