My First Few Edits

• Objective - To create 4 independent webpages, each requiring specific features to be implemented.
• Purpose - To establish familiarity with basic HTML
• Description
  • You are provided with four different html template files in a templates directory at the root of this project.
  • Using the html tags that you already know, modify the html content so each individual file looks similar to their respective image.

Part 1 - Clone the project

• Begin by forking this project into a personal repository.
  • To do this, click the Fork button located at the top right of this page.
• Navigate to your github profile to find the newly forked repository.
• Clone the repository from your account into the ~/dev directory.
• Open the newly cloned project in a code editor (Visual Studio Code, for example).

Part 2 - syntax_template.html

• Edit the syntax_template.html file to have the appropriate typographical emphasis.
• Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:
  • git add .
    • adds all of the file-changes in the current directory to staging.
      • Tip: execute pwd to view your present working directory
  • git commit -m "finished edits on 'syntax_template.html' "
    • saves staged changes to local repository along with a brief description of changes made.
  • git push -u origin master
    • uploads local repository content to a remote repository.
• The edits should render a webpage which resembles the image below

Part 3 - body_template.html

• Edit the body_template.html file to have the appropriate heading tags as well as typographical emphasis.
• Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:
  • git add .
  • git commit -m "finished edits on 'body_template.html' "
  • git push -u origin master
• The edits should render a webpage which resembles the image below

Part 4 - models_template.html

• Edit the models_template.html file to each of the following features:

  • heading tag
  • typographical emphasis
  • hyperlink which references one of the other previously edited webpages.
    • Bonus - Implement a mechanism for opening link in new tab upon being clicked.

• Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:

  • git add .
  • git commit -m "finished edits on 'models_template.html' "
  • git push -u origin master

• The edits should render a webpage which resembles the image below

Part 5 - headings_template.html

• Edit the headings_template.html file to each of the following features:

  • heading tag
  • typographical emphasis
  • HTML entities

• Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:

  • git add .
  • git commit -m "finished edits on 'headings_template.html' "
  • git push -u origin master

• The edits should render a webpage which resembles the image below

<title>Calculator</title> <style> table{ width: 200px; height: 300px; text-align: center; border: 5px solid cornflowerblue; } th, td{ border: 1px solid palevioletred; } th{ text-align: right; } td:hover{ background-color: papayawhip; color: peachpuff; } </style>