• Resolved heartcenter333

    (@heartcenter333)


    Hi I was directed here when I posted to the www.remarpro.com main forum…

    What I need is to put the overall text of my pages and posts as well as the titles to be darker… Black would be fine…

    Also the “blue” for the links, I would like to maybe change that to a purple or something…

    my website: https://www.heartcenter333.com

    Also, would like to make some changes to navigation such as making them show a little better with my background…

    Lastly I would like to bring the text box or main area down, I made the footer transparent, so I don’t need that much space at the bottom of my page… Thanks for any answers… ??

Viewing 15 replies - 16 through 30 (of 36 total)
  • Thread Starter heartcenter333

    (@heartcenter333)

    I’m going to make a new post for the other things… thanks again… best wishes!!! ??

    Here’s the rule for the main text & heading color:

    #main p, #main ul, #main ol, h2 {
       color: #555;
    }

    The value #555 what’s currently being used, a dark gray color. For colors, you can go anywhere from #000 (black) to #fff (white). Each position refers to the amount of red, green, and blue in the color, i.e., #f00 would be pure red, #0f0 is green, #f0f is magenta. For a purple color, you can darken the magenta value to something like #505 (for your links, which I will post in a bit).

    Thread Starter heartcenter333

    (@heartcenter333)

    Ok thanks… ??

    Thread Starter heartcenter333

    (@heartcenter333)

    That didn’t do anything to the colors…
    I posted it in the box with the other two commands…

    You have to use zeros (the number) and not oh’s (the letter). I probably confused you because I was using a-f in some of those values. But this is what is known as hexadecimal notation. Hexadecimal (or hex, for short) is a base-16 system, so it uses 0, 1, 2, 3 … 8, 9, A (for 10), B (for 11), C (for 12), … F (for 15). So F is the highest “number”.

    Thread Starter heartcenter333

    (@heartcenter333)

    LOL!!! No, I knew that I needed the mumbers… I don’t know why I used the o’s…

    Thread Starter heartcenter333

    (@heartcenter333)

    Thanks, I copied that to a text so I can go back to it later for future use… The main text and titles look great… ??

    Here are the rules for the links:

    a, a:visited, h1 a:visited, a:active, #main .selected .actions a,
    #main .selected .actions a:link, #main .selected .actions a:visited {
       color: #3478e3;
    }
    
    a:hover, h1 a:hover, #main .selected .actions a:hover,
    #main .selected .actions a:active {
       color: #d54e21;
    }

    The first rule is for the normal state, the second rule is for the color when a mouse is hovered over the link. Values listed are what is currently being used. You’ll notice that the hex values for these rules are six digits long. The six digits gives you more fine tuning of the color. A three digit value, like #123, is actually shorthand for #112233. So for purple, you can use #505 or #550055. Here’s a handy color picker that will give you the right hex value for the exact shade of color that you want.

    By the way, here’s a good tutorial on CSS when you get the chance.

    Thread Starter heartcenter333

    (@heartcenter333)

    That’s great!!! ?? I will play with the colors a little more, but that works great. I was actually thinking of asking you about how to learn to do the CSS on my own… So Thanks again…

    I guess one more thing if you don’t mind, you have been so very helpful to me… I guess if you could give me a coding to change the colors of the words on the navigation, and that should just about do it for today… ??

    .main-navigation .menu li a {
       color: #666;
    }

    #666 is the current value.

    There is no current rule to change the text color when the mouse is hovered over the menu item. If you want to add one, this would do it:

    .main-navigation .menu li:hover a {
    	color: #00ff00;
    }

    There’s also an existing rule that sets the active menu item (the one that correspond to the page that you’re on) to blue:

    .main-navigation li.current-menu-item > a,
    .main-navigation li.current-menu-ancestor > a,
    .main-navigation li.current-menu-item:hover > a,
    .main-navigation li.current-menu-ancestor:hover > a {
       color: #3478e3;
    }

    Oh, and I don’t know how you feel about the background of the menu item changing to white when the mouse is hovered over it, but in case you want to change it, this is the current rule:

    .main-navigation .menu li:hover {
       background: #fff;
    }

    Instead of a color, you can also use the value transparent if you don’t want any color at all.

    Thread Starter heartcenter333

    (@heartcenter333)

    Perfect again!!! There’s just one more thing now, I noticed that for some reason there is a white box that shows up over the nav button before you click it… It was showing up sometime after the previous changes, before I put any of the 3 codes above for the navigation… Could you be able to tell me what got crossed or what is going on with this? ??

    Thread Starter heartcenter333

    (@heartcenter333)

    You got me before I did… ?? ok let me do the next one…

    Yeah, I thought that looked a bit odd. I guess great minds think alike ??

    Thread Starter heartcenter333

    (@heartcenter333)

    Transparent didn’t work… I’m going to try it again

Viewing 15 replies - 16 through 30 (of 36 total)
  • The topic ‘A few changes…’ is closed to new replies.