Basic-HTML-CSS/index.html at main · BusranaAlme/Basic-HTML-CSS · 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
67
68
69
70
71
72
73
74
75
<!-- html basic codes in VS with live server -->
<!DOCTYPE html>
<!-- here html below is the root element where there are two elements included -->
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>First Web</title>
</head>
<body>

   <!-- Each line is a html element here  -->
    <!-- h1 h3 are tags -->
     <!-- Instructions/Writings between two opening and closing tags are called contents -->
  <h1>Hi There!<br><hr> This is my first website</h1>
  <br>
  <h2>Hi There!</h2>

  <hr>
  <h2> This is my first website</h2>
  <h3> Hello students</h3>
  <h5>I'm Alme...</h5>
  <!-- relative path -->
  <img src="/obstactle.png" alt="an obstactle object were there" width="400">
  <!-- aspect ratio: giving width and it takes height by itself -->

  <img src="/obstactle.png" alt="" width="400">
  <!-- absolute path -->
   <img src="https://bongodev.com/wp-content/uploads/2022/12/mern-1.webp" alt="Bongodev's picture was there" width="400">
   <img src="https://bongodev.com/wp-content/uploads/2022/12" alt="Bongodev's picture was there" width="400">
   <br>
  <hr>
  <p><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Architecto, dicta?</h3></p>
  <!-- hyperlink using 'a' or anchor tags -->
   <a href="https://bongodev.com/" target="_blank">BongoDev</a> is the company I'm learning in
  <ul>
    <li>Alme</li>
    <li>Alif</li>
    <li>Akhi</li>
  </ul>
  <ol>
    <li>Chaa</li>
    <li>Coffee</li>
    <li>Lacchi</li>
  </ol>
  <!-- HTML entities -->
   &copy; This is a copy tag <br>
   &reg; This is a register tag <br>
   HTML is written as &lt;html&gt <br>

   <!-- table or form -->
    <form action="https://formspree.io/f/mrbgpadn" method="POST">
      <input type="text">
      <br> <br>
       <label>
        Your Name:
      <input type="text" name="Your name"> <br><br>
    </label>
      <label for="password">Password</label>
      <input type="password" placeholder="Your password">
      <br><br>
      <label>
        Your message:
        <textarea name="message"></textarea>
      </label>
      <br><br>
      <label>
        Your email:
        <input type="email" name="email">
      </label>
      <label>
      <button type="submit">Send</button>
    </form>
</body>
</html>