diff --git a/readme.md b/readme.md index bf82136..60d8dc4 100644 --- a/readme.md +++ b/readme.md @@ -50,13 +50,13 @@ - [Exercises](#exercises-3) - [Day 8](#day-8) - [HTML Form](#html-form) - - [Meta tags](#meta-tags) - [Day 9](#day-9) - [HTML Table](#html-table) - [Day 10](#day-10) - [Lists](#lists) - [Day 11](#day-11) - [File Paths](#file-paths) + - [Meta tags](#meta-tags) | # Day | Topics | | ----- | :----------------------------: | @@ -250,7 +250,8 @@ As web developer, you should write code using a text or code editor. Therefore, I will use Visual studio code and I will use it in this challenge too. I strongly suggest to use Visual Studio Code because it has lots of productivity extensions that makes super productive. Now, let's [download](https://code.visualstudio.com/) visual studio code. ### How to use Visual Studio Code -To know how to use visual studio code, watch the following [video](https://www.youtube.com/watch?v=vSyq1ENoovI) + +To know how to use visual studio code, watch the following [video](https://www.youtube.com/watch?v=vSyq1ENoovI) ## Introductin to HTML @@ -819,6 +820,7 @@ List of blocking elements: +
@@ -900,10 +902,10 @@ List of non-blocking elements + +
+ + +
+
+ + +
+
+ +
+ + +``` + +The output the above form look like this + +
+

Application Form

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+

What are your skills

+ + +
+ + +
+ + +
+ + +
+ + +
+
+ + +
+
+

Gender

+ + +
+ + +
+ + +
+
+

Select your country

+ +
+
+

Select your country

+ +
+
+
+ +
+
+ + +
+
+ + +
+
+ +
+
+
+ +What is matters the most is understanding how the HTML form works, this is not an exhaustive list of all the input fields. Whenever you would like to solve some problem, try to search it on the internet using a key word. Searching is also one the most important skill in software development. # Day 9 ## HTML Table +In this section, we will see how to create an HTML table. Table has an external border, header rows and header cell, body rows and its cells and it could have also a footer row. To make an HTML table, we need a _table_ element that wrap all the rows and the rows wrap all the data cells. + +```html + + + + + + + + + + + +
NameGenderCountry
Asabeneh250Finland
+``` + +Let us see the output of the above code + + + + + + + + + + + + +
NameGenderCountry
Asabeneh250Finland
+However, HTML table has thead, tbody and tfooter. Let us add thead and tbody to the above code. In addition, we can use th in the table head instead to td to make the table heading bold. + +```html + + + + + + + + + + + + + + + +
NameGenderCountry
Asabeneh250Finland
+``` + +The out for the above code + + + + + + + + + + + + + + + + +
NameGenderCountry
Asabeneh250Finland
+ +The author of this challenge creates different challenges every year. Let us put all his challenges on a table. + +```html + + + 30 Days Of HTML: Table + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ChallengeDaysTimeStars(K)URL
30 Days of Python30November 20194.6K + Link +
30 Days of JavaScript30January 20206.8K + Link +
30 Days of React30October 20205.6K + Link +
30 Days of HTML30February 201133 + Link +
+ + +``` + + + + 30 Days Of HTML: Table + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ChallengeDaysTimeStars(K)URL
30 Days of Python30November 20194.6K + Link +
30 Days of JavaScript30January 20206.8K + Link +
30 Days of React30October 20205.6K + Link +
30 Days of HTML30February 201133 + Link +
+ + # Day 10 ## Lists @@ -1193,3 +1672,5 @@ Congratulations! Now, you knew about metadata. # Day 11 ## File Paths + +## Meta tags