I have Dreamweaver CS6. How do I keep my link colors from changing colors? No choice for none. All I'm given is default which is blue and other color choices. I have it set to hover red, works fine. Any suggestions?
So far I have:
a:hover {
text-decoration: none;
color: #F00
a:link {
text-decoration: none;
color: none;
Related
I am using bootstrap 5 "text-muted" to grey out or dim the text. On hover, I would like to undo this effect on the text. I am able to make other effects for e.g. text decorations (underline) etc., on hover but not able to revert this effect. Is there a way to do this?
li a {
color: white;
&:hover {
text-decoration: underline;
}
}
<li class="nav-item mb-2">Home</li>
BS provides the .text-reset class which does what you want.
Since you are compiling from source you can just extend the class:
li a {
color: white;
&:hover {
#extend .text-reset;
text-decoration: underline;
}
}
Or,
If you look at the style rule you can see what declarations are needed:
.text-reset {
--bs-text-opacity: 1;
color: inherit!important;
}
And copy them to your rule:
li a {
color: white;
&:hover {
--bs-text-opacity: 1;
color: inherit!important;
text-decoration: underline;
}
}
You need to revert the color of the link (like the color of the body) when hovering it
.nav-item a:hover {
color: $gray-900 !important; // It is #212529
}
If you will see the default color of the body in the variables.scss file it is $gray-900
$body-color: $gray-900 !default;
I am trying to change color of material badge on hover.
I set
<div matBadge="+"
matBadgePosition="after"
matBadgeColor="accent"
matBadgeOverlap="false"
matBadgeSize="large">
</div>
::ng-deep .mat-badge-content:hover {
background-color: #98daf5;
color: white;
}
But it does not change at all.
How can I change color of the badge on hover?
When hovering div add .mat-badge-content.
::ng-deep div:hover .mat-badge-content {
background-color: #98daf5;
color: white;
}
I have a link that looks like this:
Документи
And problem is that in Safari when "Документи" is underlined, letter "Д" and "у" cut line and there is small white space in link line.
How to remove these white gaps in link?
Remove the underline for all <a> elements
In CSS you could do:
a {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
Remove the underline for only Cyrillic class
Or alternatively for only Cyrillic links:
a.cyrillic {
text-decoration:none;
}
a.cyrillic:hover {
text-decoration:none;
}
Here's a JSFiddle to clarify.
This removes the underline from the link. It's by no means perfect (if you wanted to retain the underline) but it at least solves the issue by removing it entirely. Of course, this assumes that your links are coloured somehow
border-bottom underline
It is possible to get the result you want using the CSS border-bottom style as such:
a.cyrillic {
border-bottom: 1px solid currentColor;
text-decoration: none;
}
a.cyrillic:hover {
border-bottom: 1px solid currentColor;
text-decoration: none;
}
And obviously on your HTML <a> element it should be:
Документи
Here's another JSFiddle to clarify.
I am trying to customize the appearance of text areas by setting a css style as follows in my own theme:
textarea.v-textarea {
font-family: 'Lucida Console', Monaco, monospace;
background-color:black;
color: light green;
}
This works fine when the TextArea does not have the focus (i.e. text is green and background is black). The moment I click in the TextArea, the background switches back to white...what am i missing? Thanks!
you can override other styles by adding !important to the style
textarea.v-textarea {
font-family: 'Lucida Console', Monaco, monospace;
background-color:black !important;
color: light green;
}
I would also search all the css and see if somewhere there is something like this and remove it
textarea.v-textarea::selection {
font-family: 'Lucida Console', Monaco, monospace;
background-color:white;
color: light green;
}
I was trying to change the .active state's default color. Tried changing in the .ui-btn-active. Didn't work. Any ideas?? Here is the link
Try adding it as the last rule, with the !important clause:
.ui-btn-active { color: red !important; background: none !important; background-color: green !important; }
Worked fine here on your jsFiddle.
This worked with your jsFiddle example:
.ui-header .ui-navbar li a:active {
color: #FFFFFF;
}