Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Change Font Color on One Section?


PaulMichaelArmstrong

Question

8 answers to this question

Recommended Posts

  • 5

Paul, if you right-click in that section and select Inspect Element, you'll get a handy little inspector that opens at the bottom of your window. Look closely at the highest level

tags. The one enclosing the section of interest specifies id = 'pricing-section'. That's the ticket, right there.

Knowing that section name, you can use it to target different elements with in the section. For example, to change paragraph text color:


#pricing-section p {color: white;}

And to change the color of heading-3 elements, which I think you'll need to do:


#pricing-section h3 {color: white;}

The above are lines of CSS. You would add them into your Custom CSS Editor. Do you know how to do that?

Try the above rules. See how they work out.

Oh, you can also specify colors by number, as in:


#pricing-section p {color: #f0f0f0;}

Hope that helps.

Jonathan Gennick

Author: Learn CSS for Squarespace

Link to comment
  • 0

Hello John:

I am trying to change the color of just a few lines of text on an index page. I can't seam to access the inspect element function from the text block on page settings. Any suggestions?

Thanks,

Matt

Link to comment
  • 0

Hello John:

I am trying to change the color of just a few lines of text on an index page. I can't seam to access the inspect element function from the text block on page settings. Any suggestions?

Thanks,

Matt

Link to comment
  • 0

You can also use this Chrome extension to get the unique block ID to target any individual Text Block on the site for CSS:

https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde

Then structure the CSS like this:


#block-yui_3_17_2_33_14884356287498_9144 p {color: #000000}

"p" targets body text, and "h1", "h2", and "h3" target the different headings. Use that after the block ID (with a space) and before the curly bracket "{}".

Link to comment
  • 0

Another option, if you need to target text within a paragraph (

p

element) is to try Squint, a plugin I created for Squarespace that allows for custom styles, more headings, superscript, subscript, underline and more. You can select a single word (like this), a sentence, or whatever - like you'd expect with most WYSIWYG editors.

-Brandon


Edited by brandon
Initial Revision

If a response helped you out, send a 'Like' 👍 (bottom-right) and/or 'Upvote' vote.jpg.c260784ece77aec852b0e3049c77a607.jpg (top-left)

Link to comment
Guest
This topic is now closed to further replies.
×
×
  • Create New...