How to add italic hover to your navigation & text links (hyperlinks) with CSS (Squarespace 7.0 & 7.1)
Adding a hover state to hyperlinks throughout your site is a great way to create movement and incorporate an interactive element. We love dressing up our hyperlinks with an italic hover state for a modern and editorial look and feel.
To add italic hover links on your website, navigate to Design > Custom CSS, and copy/paste the following CSS:
Italic hover for headings:
// H1 ITALIC HOVER h1 a:hover {font-style: italic;} // H2 ITALIC HOVER h2 a:hover {font-style: italic;} header nav a:hover{font-style: italic;} // H3 ITALIC HOVER h3 a:hover {font-style: italic;} // H4 ITALIC HOVER h4 a:hover {font-style: italic;}
Italic hover for paragraphs:
// PARAGRAPH ITALIC HOVER p a:hover{font-style: italic;}
Italic hover for navigation links:
// ITALIC HOVER FOR NAV LINKS header nav a:hover{font-style: italic;}
PIN THIS TUTORIAL FOR LATER!
