How To Create Your Own HTML And CSS Website For Yourself
By: Khader Othman
How To Create Your Own HTML And CSS Website For Yourself
(INTRO)
Hypertext Markup language or more formally known as (HTML) is a code language that is used to make countless websites that we use today. HTML makes it easier for us to view websites as it helps us construct and create the web page and many things that will allows as to freely browse websites the way we do. HTML was first invented by Tim Berners Lee about 1990. Tim Berners Lee worked with his group in the European Organization for Nuclear Research (CERN) to produce HTML.
Cascading Style sheets or known as (CSS) for many developers of websites is the code that styles an HTML. It helps to write code easier and more efficient as there are easy ways to learn the code as it will be shown in the next slides. CSS was first created in the October of 1994 by Håkon Wium Lie and Bert Bos. CSS was first made in the European Organization for Nuclear Research (CERN).
How To Create Your Own HTML And CSS Website For Yourself
The Code of the HTML structure can be shown in the following image.
This code is the start of any HTML.
The <html> tags are the start and end of the code, and are the tags you add the important code inside.
This tag is the head or title and it is where you add your <style> tag and all the CSS.
This tag is what is known as the body or what most of your HTML site will look like and have.
l
This tag defines a title.
How To Create Your Own HTML And CSS Website For Yourself
(Important)
HTML like all the numerous languages has basics, learning these basics can give you reasonable amount of knowledge to have the skills to create a basic HTML site. For example, a important basic that every HTML needs is the <! DOCTYPE html>. This small piece of code makes every HTML alive.
CSS on the other hand also has basics with HTML, CSS makes Basics to perfection. For example every CSS code require the CSS tag of <Style>. Without that tag it wouldn't work. This is because the CSS is an agreed upon by everyone. After you add that you add another one and add a little space so that you can add the CSS styling. You add that tag between the HTML, <head> tags.
<! DOCTYPE html>
<Style>
How To Create Your Own HTML And CSS Website For Yourself
(Important)
A critical piece of HTML code is the tag called <html> which is after the <! DOCTYPE html>. This tag is also at the end of the code and it looks like this </html>.
A <head> tag is where you add your <title> tag and your <style> tag. This is important because a good title is critical for the success of a website
A <body> tag is found under the <head> and inside of the <html> tag. This tag is of great value as almost all of your site will be based on what's inside of your <body> tag.
<html>
<head> <title> <style>
<body>
<h1>
In HTML there are code that goes inside of a <body> tags.
<h1>, <h2>, <h3>, <h4> and so on are sizes for your headings in the <body> tag.
In HTML, the <p> tag means paragraph or where you write text so that it’s in a paragraph form.
<p>
How To Create Your Own HTML And CSS Website For Yourself
(Important CSS: Selecting By Tag)
This code is showing us how I selected the <h1> tag and changed it color using CSS.
This is the tag that I selected using the CSS selecting by tag.
(Side Note)
Notice how there's an opening and a closing for every tag. For example when you look at an <h1> tag, you can see it has the content inside and there is a closing tag that looks like this </h1>
How To Create Your Own HTML And CSS Website For Yourself
(Important CSS: Selecting By Class)
This code is showing us how I selected the <h1> tag by the class “food” and changed it color using CSS.
This is the code for selecting it my class, <tag class="class-name"></tag>
How To Create Your Own HTML And CSS Website For Yourself
(Important CSS: Selecting By ID)
This code is showing us how I selected the <h1> by the ID “food” and changed it color using CSS.
This code is showing us what I selected by ID and how I wrote it in code. <tag id="id-name"></tag>
How To Create Your Own HTML And CSS Website For Yourself
(Importance To Our Society)
It’s beneficial to know how much HTML and CSS brought to our society, as HTML made it easier to browse websites and to make it easier for us to gain knowledge. Also CSS increased the overall user experience as it made it more pleasing and demonstrative. It important to acknowledge how both HTML and CSS transformed our way of sharing thought and ideas in this technological advancing world. In conclusion, CSS and HTML improved my learning as now I know how to make my own HTML and CSS website for myself.
Thank you for taking the time to view my slide. A student at North Salinas High School (NSHS).
By: Khader Othman