1 / 9

Website Design Club

Website Design Club. 10/14. Itinerary. Attendance, notes from leaders, announcements Request from Newspaper Club leader Review what happened Saturday Review what we have learned so far Today’s HTML: Inserting pictures Inserting links Lists Also new today: CSS What does CSS mean?

john-chaney
Download Presentation

Website Design Club

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Website Design Club 10/14

  2. Itinerary • Attendance, notes from leaders, announcements • Request from Newspaper Club leader • Review what happened Saturday • Review what we have learned so far • Today’s HTML: • Inserting pictures • Inserting links • Lists • Also new today: CSS • What does CSS mean? • What can we do with CSS? • Review

  3. Housekeeping • Attendance • Announcements • President • Vice-president • Notes from Saturday • Thank you secretary/scribe • Do you want to make a website for the newspaper club?

  4. Saturday • Secretary, please tell us what you learned

  5. Review • Basic website layout • Websites are made of one or more web pages • Web page • Basic structural elements • Starts and ends with <HTML> and </HTML> • <Head></Head> element contains <title> of website and certain links • <body> element contains everything else • Text arrangement • Headings <h1> is the largest, <h6> is the smallest • <p> is used for blocks of text

  6. New stuff: HTML • Inserting images • This is your image element: • <img…> everything after img tells the web browser where to find the picture • <imgsrc="Profile Images/MarkToastBubbleStudentPics.png" alt="Mark toasting student pictures"> • This means the picture must be on your website’s server • Inserting Links • <a href=“website link”>What the user clicks on</a>

  7. HTML: Lists • If we want to make a list like this: • Mark • His dog • His cat • Then we use • <ul> • <li>Mark</li> • <li>His dog</li> • <li>His cat</li> • </ul>

  8. CSS – What is it? • CSS stands for Cascading Style Sheet • CSS is how we turn words on a white screen into a beautiful website • We can use it to: • Create a border around an object • Change the background color • Change the font style and size of the words • Make your pointer turn into a hand in some places • And so much more!

  9. Css example • /* CSS Document */ • html, body { • background-image: url(Tile%20pictures/note_paper_background-light_brown.jpg); • background-repeat:repeat; • margin:0; • padding:0; • height:100%; • font-family: "MS Serif", "New York", serif; }

More Related