HTML-and-CSS-Projects

Here is a list of the projects and descriptions of each project in this repository.

BasicFolder

• BasicHTML: this is a basic HTML template.
• SimpleHTML: same as basic HTML

Basic_HTML_and_CSS

Audio Files

* Don'tListen.mp3: Don't listen to this file.

• Audio.html: a basic website with an audio file
• Basic_CSS_1.css: CSS file that changes text color to green.
• Basic_CSS_2.css: changes text color to red and other formatting
• Basic_HTML_3.html: html meant to be styled with CSS
• Basic_HTML_4.html: html meant to be styled with CSS (more complex)
• Basic_HTML_5.html: html linking to CSS
• CSS_Lists.css: CSS for lists
• CSS_Table.css: CSS for tables
• HTML_Lists.html: HTML that uses lists
• HTML_Table.html: HTML that uses tables

Basic_HTML_and_Javascript_1

Images

* puppy.jpg: a picture of a puppy

• Basic_HTML_1.html: Basic HTML with some font stylings
• Basic_HTML_2.html: basic html button, that works!
• Basic_Javascript_1.js: Javascript for use with Basic_HTML_2.html

HTML Documents

Images

* catpic.jfif: cat picture
* Dog.jpg

• Assignment.html: An assignment that experiments with various fonts.
• Dog.html: An html that focuses on dog pictures
• Dog_video.html: An html that adds a dog video
• image.html:an html with a cat image
• Notepad++Assignment.html: An experiment with notepad

HTML Forms

• Form_Assignment.html: An html with a form

HTML_and_CSS_Challenges

CSS

* error_style.css: CSS for use with errors.html

videos

* video.mp4: a video of a flower

images

* 2HeadBear.png: The flag of the New California Republic
* cloud.jpg: a picture of a massive space cloud
* download.jfif: another big space cloud

• eighthchallenge.html: html with text on a picture
• fifthchallenge.html: html with a stylized, working navbar
• firstchallenge.html: html with a stylized version of the NCR flag
• fourthchallenge.html: html with the NCR flag centered
• HTML_Spacing_Challenge.html: html with line breaks
• Media_Query_Challenge.html: html that uses a media query to resize the page when at a minimum pixels
• Ninthchallenge.html: muted autoplay video
• SeventhChallenge.html: html with a hover effect
• SixthChallenge.html: html with columns
• Tenth_Challenge.html: html with Centered video
• Third_challenge.html: html with a list
• errors.html: an html with errors that I fixed. You're welcome
• second_challenge.html: footer with centering

LiveShare

• Hello_World.js: simple javascript to be used with SimpleBasicHTML.html
• SimleBasicHTML.html: this uses simple code

One-Page Website

CSS

* one_page_website.CSS: CSS used with the one_page_website.html

image

thumb

  * thumbnail_1.jpg: a picture of a corgi
  * thumbnail_2.jpg: a picture of Rocky
  * thumbnail_3.jpg: a picture of a cat

• Website Plan.txt: a plan for one_page_website.html
• one_page_website.html: a one page website

Portfolio

Images

* GitHub-logo.jpg: the GitHub logo
* Python.png: the Python logo
* c-sharp-dot-net.png: C# and .NET logo
* coding.png: coding image
* coding_icon.png: coding icon
* coding_image.jpg: an image of coding
* contactme.png: a "contact me" image.
* js_html_css.jpg: JavaScript, html, and CSS pic
* personal_pic.jpg: Personal pic of me
* sql_and_databse.jpg: SQL and Database pic

JS

* portfolio.js: JavaScript for the portfolio.

Stylesheets

* CSS.css: the CSS for index.html

Videos

* coding.mp4: a video fo coding

• index.html: the html for the portfolio website

Project

CSS

  * animations.css: animations for index.html
  * basic_style.css: basic style sheet
  * menu_rollover.css: menu rollover animation
  * photo_style.css: photo styling css
  * shared.css: css that is shared with index.html

Images

* americanflag.png: a picture of the american flag

Icons

    * download.png: a big red E
    * favicon.ico: a favicon made out of download.png
    * smileyface1.png: a picture of a smiley face with eyes open
    * smileyface2.png: a picture of a smiley face with eyes closed

Thumbs

    * thumbnail_1.jpg: music picture
    * thumbnail_2.jpg: education pic
    * thumbnail_3.jpg: Hosokawa Micron pic
    * thumbnail_4.jpg: The Tech Academy logo
    * thumbnail_5.jpg: Messiah University pic
    * thumbnail_6.jpg: Internet Logo
    * thumbnail_7.png: C# logo
    * thumbnail_8.png: HTML and CSS pics
    * thumbnail_9.png: Coding picture

• Basic_CSS_Demo_1.html: A basic CSS demo iin html
• Basic_HTML_Template.html: basic html template
• CSS_menu_rollover.html: html for menu rollover
• photo-package.html: html with a lot of photos in it
• index copy.html: a copy of an older version of index.html
• index.html: the project's main index

bootstrap4_project

images

* beautyandthebeast.jpg: a picture of beauty and the beast
* ghostintheshell.jpg: a picture of ghost in the shell
* kongskullisland.jpg: kong skull island
* pdx.jpg: picture of portland

• academy_cinams.html: a website about academy cinemas
• bootstrap_columns.html: a website that uses bootstrap columns

README.md: this file