Portfolio_Unit6/HomePage.html at master · FelixScript/Portfolio_Unit6 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!doctype html>
<head>
  <title>Portfolio Page</title>
  <link href="style.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
  <script src="script.js"></script>


</head>
<body>
  <header>
    <input type class = "seachbar" name="search" placeholder="Search......">
    <IMG id= "Ads" SRC="" ALT="some text" WIDTH=32HEIGHT; height=32;>
    <img id="profile" src="https://www.w3.org/html/logo/downloads/HTML5_Logo_512.png" style="width:250px;height:250px;">
    <h1>Welcome to HTML Coursing Class</h1>
     <ul class= "navlist">
      <li><a class="nav" href="">Home</a></li>
      <li><a class="nav" href="">About</a></li>
      <li><a class="nav" href="Contact.html">Contact</a></li>
      width
    </ul>

  </header>

<div class="Tab1">
    <h2 class ="project-title">A Brief Intro of the Course</h2>
    <p>In this Course, you will learn the basics of Html, Css, and JavaScript Programming Language to design Websites using Could9. We will start, First start using HTML to create the Web Pages and Web Applications.
    Learing a Programming Language is like solving a  puzzle.
    Just like learning any Human Language, such as Spanish,  French, or Arabic.</p>
    <p>So, when a designer is given an task to create a webpage that has this a specific header, font, colors,  pictures, and an animation that has planes going from right to left in the user's screen, only if the user clicks on a specific button or words,
    The web designer's job is to take that big idea and break it apart into small pieces, and then translate these pieces into computer readable, so  the computer can understand it and make it's magic.Also,
    including putting all these pieces in the correct order, just  like English Language that has it's subjects, verbs, and objects the same applies  Programming Language, which it has its UNIQUE SYNTAX!</p>
    <p></p>
  </div>


<div class="Tab1">
    <h2 class="project-title"> What is HTML</h2>
    <p>HTML stands for "HyperText Markup Language". The "Markup Language"  stands for being a programming language that uses a programming language to perform functions, it uses tags to identify content.
    Html is the provider basic structure of sites and works together with CSS and JavaScript &nbsp; Note: "What to learn more about those two Scroll Down"&nbsp; they make it's magic combing them together.
    Html is the starting point where a programmer starts to create content for the web and is very easy going to learn.</p>
    <p class = "PageHtml">For  a example of basic structure of HTML,  here is a  screenshot of what I talking about.</p>
    <img class="HtmlPage" src="https://www.dynpg.org/wiki_en/images/3/30/Simple_Website_Complete.png" style="width:690px;height:400px;">
    <p>To continue, HTML uses tags, also known as "elements." These tags have inherent names: Header tags, paragraph tags, image tags, and many more.</p>
    <p>Every web page is made up of many of these HTML tags that indicate, each type of content on the page. Each type of content on the page is surrounded by, HTML tags.
    One of the HTML tags is the p tag. Here is an example.</p>
    <img class="PTag" src="http://code4beginner.com/images/Html/HTML-Paragraph-Tag-1.png" style="width:490px;height:300px;">
    <p class = "PTag">It has a opening and closing tag inside the content. Using HTML, you can add headings, format paragraphs, control line breaks, make lists, emphasize text, create special characters, insert images, create links, build tables, control some styling, and much more.</p>
    <p class = "Ptag">We will go more into coding in HTML, if you want to go ahead,  here is a link about how to get started using HTML and the other three: <a href="https://www.youtube.com/watch?v=3JluqTojuME&list=PLoYCgNOIyGAB_8_iq1cL8MVeun7cB6eNc">LINK</a> </p> &nbsp;
    Note: This link of Vidoes aren't not made from me, I give critic to "LearnCode.academy" for making these vidoes.


<div class="Tab1">
    <h2 class ="project-title">What is CSS</h2>
    <p>CSS is the stylist of the group of the three. You see all of those crazy colors, interesting fonts, and background images, all of those effects come from thanks  to CSS. It gives the entire tone and mood of a web page, making it an important  tool when it comes creating web pages
    and an important skill for web developers to learn. It's also helps  websites to adapt to different screen sizes and device types, such as Iphones and  Androids.</p>
    <p>To show what CSS does to a webpage,  here is a screenshot of what it looks like.</p>
    <p>Here is a screenshot of what it looks like without CSS:</p>
    <img class="PTag" src="https://sdz-upload.s3.amazonaws.com/prod/upload/page_html.png" style="width:590px;height:400px;">
    <p>Notice all the content is still there, but the visual styling is not THERE!. This is what you might see if the style sheet doesn't load on the website, for some reason. Now, here's what the same web page looks like with CSS added. </p>
    <p>Screenshot with HTML and CSS:</p>
    <img class="PTag" src="https://sdz-upload.s3.amazonaws.com/prod/upload/css22.png" style="width:590px;height:400px;">
    <p>Isn't better seeing? CSS is a list of rules that can assign different properties to HTML tags, specified to single tags, multiple tags, an entire document, or multiple documents. It exists because, as design elements like fonts and colors were developed,
    web designers had a lot of difficulty adapting HTML to these new features.</p>
  </div>
</body>