{"id":527,"date":"2019-10-28T14:50:58","date_gmt":"2019-10-28T14:50:58","guid":{"rendered":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/?p=527"},"modified":"2019-10-28T14:50:59","modified_gmt":"2019-10-28T14:50:59","slug":"styling-links","status":"publish","type":"post","link":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/2019\/10\/28\/styling-links\/","title":{"rendered":"Styling Links"},"content":{"rendered":"\n<p>Links on a web page are made through an anchor (a) element:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;a href=\"newpage.html\">Go to New page&lt;\/a><\/code><\/pre>\n\n\n\n<p>When we&#8217;re styling them in addition to styling the basic a element you can also style different states of the link:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>visited: what it looks like when someone has already cliked the link before<\/li><li>hover: what it looks like when the mouse is over the link before it&#8217;s clicked<\/li><li>active: what it looks like when it&#8217;s being clicked<\/li><\/ul>\n\n\n\n<p>To style these states you use a pseudo selector by adding a colon and the name of the state.<\/p>\n\n\n\n<p>Below are all of the basic selectors you need to style links. Change the colors to match the color you want for your links. I&#8217;ve left out active since it&#8217;s only there for a short time and not essential to style, but feel free to style it if you want.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/* == LINK Styling ==== *\/\na, a:visited, a:hover{\n  text-decoration: none; \/*removes underline in all states*\/\n}\na{\n  color: #0033ff;\n  border-bottom: 1px solid #0033ff; \/*adds in border instead of underline, make sure to match color of text *\/\n}\na:hover{\n  color: #005599;\n  border-bottom: 1px solid #005599; \/*adds in border instead of underline, make sure to match value given for \"color\" *\/\n}\na:visited{\n  color: #880099;\n  border-bottom: 1px solid #880099; \/*adds in border instead of underline, make sure to match value given for \"color\"*\/\n} <\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Links on a web page are made through an anchor (a) element: When we&#8217;re styling them in addition to styling the basic a element you can also style different states of the link: visited: what it looks like when someone has already cliked the link before hover: what it looks like when the mouse is [&hellip;]<\/p>\n","protected":false},"author":16,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"portfolio_post_id":0,"portfolio_citation":"","portfolio_annotation":"","openlab_post_visibility":"","footnotes":""},"categories":[10,12,7],"tags":[28,91],"class_list":{"0":"post-527","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-css","7":"category-design","8":"category-resource","9":"tag-css","10":"tag-links","11":"czr-hentry"},"_links":{"self":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/posts\/527","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/comments?post=527"}],"version-history":[{"count":3,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/posts\/527\/revisions"}],"predecessor-version":[{"id":547,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/posts\/527\/revisions\/547"}],"wp:attachment":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/media?parent=527"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/categories?post=527"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-240-fall-19-stein\/wp-json\/wp\/v2\/tags?post=527"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}