Skip to content

Latest commit

 

History

History
50 lines (35 loc) · 1.61 KB

Day3.md

File metadata and controls

50 lines (35 loc) · 1.61 KB
Raw

Day 3 of WebDev Summer camp!

Today we are changing the size of our image ( or images! ) and adding more HTML tags to our website. Also, we will inspect our website to see the HTML we created.

Open your website

  • Make sure your flash drive is plugged in
  • Open your File Explorer ( the yellow folder at the bottom corner )
  • Find the USB Drive drive on the left side
  • In your USB Drive, go into your website project folder
  • Double click the index.html file
  • In the web browser viewing your website Right Click anywhere on the page and then click Inspect. What do you see?

Open your website's HTML code

Open VS Code program. The icon looks like this:

image

If you're index.html is not already there, follow this:

  • In the top left corner, go to File -> Open Folder
  • Find your USB Drive on the left side of the exploroer
  • In there, find your website project folder
  • Once you find it, click the folder then 'Select Folder' to continue

Resizing images

Your super duper HTML code should look similar to this:

<h1>My Website Title</h1>
<img src="imagename.jpg" />

To resize your image, you can add width and height attributes.

  • Look at how I changed my image's width and height below
<h1>My Website Title</h1>
<img src="imagename.jpg" width="200" height="200" />

List of all HTML Tags

Click here to view all HTML tags

What would you add to your website? My favorite is the <summary> tag!