search

Media-Ed-Online / intro-web-dev-2017aut

Site for course "Introduction to Web Design and Development."
https://media-ed-online.github.io/intro-web-dev-2017aut/
MIT License
12 stars 3 forks source link

Style #74

Open ehorchover opened 6 years ago

ehorchover commented 6 years ago

A lot of websites have colored backgrounds and different text size/format. I've been trying to figure out more on www.w3schools.com but I am still slow on this coding thing. Any tips for simple styling?

JonSwallow commented 6 years ago

@ehorchover

Its all in the style

  <head>
    <meta charset="utf-8">
    <meta name="description" content="Installing a Virtual Machine in Windows">
    <meta name="author" content="Jon Swallow">
    <meta name="viewport" content="width=device-width,initial-scale-1.0">
    <title>Installing a Virtual Machine in Windows</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bitter">
    <style>
      body {background-color: #6aa1eb; font-family: 'Bitter', serif;}
      h1 {color: #515151;}
      h4 {color: #515151;}
      p {color: #252528;}
    </style>
  </head>

line 7 link to google api there you will find a font family to suit your needs and all you have to do is link it

line 9 background color and again font family. You can adjust these. Hex color scheme.

so play around with the color and find a font in google api, that is pretty much all there is to it.
the link will only change as far as the font is concerned for ex. "https://fonts.googleapis.com/css?family=" Insert font family name here"

ehorchover commented 6 years ago

@JonSwallow Thank you! I will play around with it.