CSS
(Cascading Style Sheet) CSS (Cascading Style Sheet) List of rules
Each CSS rule has: Selector Property Value
<style type="text/css"> body { color: purple; background-color: #d8da3d } </style>
Selector <style type="text/css"> body { color: purple;} </style>
Property <style type="text/css"> body { color: purple;} </style>
Value <style type="text/css"> body { color: purple} </style>
Placed in the head “box” <!DOCTYPE html> <html> <head> <title>My First Code</title> <style type="text/css"> p{ style info for paragraphs} </style> </head> <body> <h1>My First Heading</h1> <p>My First Paragraph</p> </body> </html>
<style type="text/css"> p{ style info for paragraph} <!DOCTYPE html> <html> <head> <title>My First Page</title> <style type="text/css"> p{ style info for paragraph} </style> <head/> <body> <h1>My First Heading</h1> <p>My First Paragraph</p> </body> </html>
<style type="text/css"> h1{ font-family: Arial, Times, serif; <!DOCTYPE html> <html> <head> <title>My First Code</title> <style type="text/css"> h1{ font-family: Arial, Times, serif; background-color: #00FFFF; position: absolute; top: 50 px; left: 100px } </style> <head/> <body> (etc…)
Common Style Sheet tags: - h1, h2, h3, h4…. - p - body - a:link (before visiting the link) - a:visited (after visiting the link) - div
Class <head> <style type="text/css"> .something { color: purple; background-color: #00FFFF } </style> </head> <body> <p class=“something”>Your Text Here</p> </body>
ID (IDs are only used once) #somethingelse { width: 100px; background-color: #d63078} .something { color: purple; background-color: #00FFFF } …....................................... <div id=“somethingelse”> <p class=“something”>Your Text Here</p> <p class=“something”>Another Sentence</p> </div>