1 / 9

Introduction to HTML and CSS: Website Design Essentials for Newspaper Club Leaders

Join us for an engaging session on website design where we will delve into the basics of HTML and CSS. We will review what we learned last Saturday, discuss attendance, and highlight announcements from our club leaders. Participants will learn how to insert images, create links, and format text using HTML. We will also introduce CSS and explore its significance in transforming web pages. Don’t miss this opportunity to enhance your web design skills and contribute to developing a website for our Newspaper Club!

john-chaney
Download Presentation

Introduction to HTML and CSS: Website Design Essentials for Newspaper Club Leaders

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