-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfrom40onwards.html
144 lines (109 loc) · 3.97 KB
/
from40onwards.html
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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- lec 40 table starts here -->
<h1 style="color:rgb(139, 210, 238)"><u>Heaviest birds</u></h1>
<table>
<thead><!--this is to show that this is a header-->
<tr>
<th>bird name </th><!-- well this makes the text bold t header-->
<th>avg weight</th>
<th>can fly</th>
</tr>
</thead>
<tbody>
<tr> <!-- for a table row -->
<td>ostrich</td><!-- for table data -->
<td>106.5</td>
</tr>
<tr>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
</tr>
</tbody>
</table>
<br>
<br>
<br>
<br>
<!-- now for columns with two subheadings like in avg mass
i can have kilo and pound under avg weight -->
<h1> table 2</h1>
<table>
<!-- <colgroup width="300">
<col />
<col />
</colgroup> -->
<thead><!--this is to show that this is a header-->
<tr>
<th rowspan="2">bird name </th><!-- well this makes the text bold t header-->
<th rowspan="2">avg weight</th>
<th>can fly</th>
</tr>
</thead>
<tbody>
<tr> <!-- for a table row -->
<td>ostrich</td><!-- for table data -->
<td>106.5</td>
</tr>
<tr>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
<td>fbfgbfg</td>
</tr>
</tbody>
</table>
<!-- LEC 46 the form element -->
<h1 style="color:greenyellow"><u>Forms</u></h1>
<form action=""></form>
<!-- // it is a type of container that will conatain other elements in it or where all the inputs you make are put insode it's like a box-->
<!-- // it also tells where the whre the form data should be sent -->
<!-- LEC 47 -->
<!-- input element is the most used element in the form -->
<!-- it is used to accept data from tjhe user -->
<!-- //! -->
<!-- //* -->
<!-- //t -->
<!-- // -->
<!-- //? -->
<form action="\tacos"> <!--//* can also be www.google.com/search or any page it will take]-->
<input> <br> <!-- //! defaults to a text input that is just takes input-->
<label for="pw">this is a label->enter the password </label>
<input id="pw" type="password" name=id> <br>
<input type="date"> <br>
<input type="file"> <br>
<input type="email" placeholder="your email id "> <br>
<!--// hmm the placeholder didn't work here why? coz of comma between eamil and placeholder-->
color picker <input type="color"> <br>
<button>will always take to action = destination mentioned</button>
</form>
<!-- //t AN EXAMPLE HOW FORMS WORK AND ASK QUERY TO GOOGLE & YOUTUBE -->
<br>
<form action="https://www.google.com">
<input type="text" name='q'>
<button>Search in google</button>
</form>
<!-- LEC 49 buttons -->
<button>outside the form it will do nothing</button>
<!-- lec 53 -->
<form>
<textarea rows="3" cols="15"
placeholder="experiments"></textarea><!--//t well here i can input any form of texrt so it's useful-->
</form>
<!-- LEC 54 form validations -->
<!-- //! some constraints that must be added to fields in for example password must b=conatin a number special character or must be atleast 8 characters long ectc etc -->
<!-- //? now for this we need a particular attribute called required -->
<h2>Validations demo</h2>
<form action="www.google.com">
</form>
</body>
</html>