-
Introduction to the BootCamp 3
-
What you will learn 05 minLecture1.1
-
Teaching Methodology 05 minLecture1.2
-
Starting with Networks 03 minLecture1.3
-
-
Understanding The Internet 14
-
What is the Internet? 02 minLecture2.1
-
A Simple Computer Network 03 minLecture2.2
-
From Simple Network to the Internet 06 minLecture2.3
-
Understanding Internet Protocols 05 minLecture2.4
-
Internet Protocol (IP Address) and Domain Name Service (DNS) 04 minLecture2.5
-
Clients and Servers and How They Interact 04 minLecture2.6
-
Data Packets, Routing and Reliability 06 minLecture2.7
-
What is HTTP? 02 minLecture2.8
-
HTTP and other Protocols 02 minLecture2.9
-
Client – the User Agent 03 minLecture2.10
-
The Web Server 02 minLecture2.11
-
Anatomy of an HTTP Request 02 minLecture2.12
-
Anatomy of an HTTP Response 02 minLecture2.13
-
Section Quiz 10 questionsQuiz2.1
-
-
Intro to HTML - HyperText Markup Language 73
-
Introduction to HTML 04 minLecture3.1
-
Hypertext Markup Language – What does it really mean? 02 minLecture3.2
-
What are Tags? 05 minLecture3.3
-
How Browsers Work 03 minLecture3.4
-
Basic HTML Structure 05 minLecture3.5
-
Sample Document 02 minLecture3.6
-
Nested HTML Elements 04 minLecture3.7
-
Types of HTML Tags 11 minLecture3.8
-
Installing a Code Editor 04 minLecture3.9
-
Creating an Index File 03 minLecture3.10
-
Features and Benefits of VsCode 05 minLecture3.11
-
Empty HTML Elements 04 minLecture3.12
-
HTML Attributes 05 minLecture3.13
-
Width, Height, Cases & Quotes 05 minLecture3.14
-
Alt Attribute 03 minLecture3.15
-
Style Attribute 02 minLecture3.16
-
Adding Multiple Style Properties 05 minLecture3.17
-
Tooltip 03 minLecture3.18
-
HTML Comments 04 minLecture3.19
-
Section Quiz 10 minLecture3.20
-
Navigation Menu 03 minLecture3.21
-
HTML Links 04 minLecture3.22
-
From Webpages to Website 09 minLecture3.23
-
Absolute Vs Relative URL 04 minLecture3.24
-
Relative URL Referencing 08 minLecture3.25
-
Target Attribute 02 minLecture3.26
-
Image Linking 04 minLecture3.27
-
Lists 04 minLecture3.28
-
List Markers 07 minLecture3.29
-
Section Quiz 15 minLecture3.30
-
Description List 07 minLecture3.31
-
Creating Bookmarks 08 minLecture3.32
-
Image Floating 05 minLecture3.33
-
Background Image and Centering in HTML 08 minLecture3.34
-
HTML Table 07 minLecture3.35
-
Adding Images to Tables 04 minLecture3.36
-
Inline and Internal CSS in HTML 11 minLecture3.37
-
External CSS 08 minLecture3.38
-
CSS Precedence 03 minLecture3.39
-
Applying CSS To Table Head 06 minLecture3.40
-
Table Center 02 minLecture3.41
-
Styling Multiple Elements 04 minLecture3.42
-
Styling with nth-child 04 minLecture3.43
-
Vertical Zebra Styling 02 minLecture3.44
-
Overlapping Zebra Style 01 minLecture3.45
-
Border Values 05 minLecture3.46
-
Quiz 10 minLecture3.47
-
Colspan 04 minLecture3.48
-
Rowspan 03 minLecture3.49
-
Using Table Layout in Web Design 05 minLecture3.50
-
HTML Forms 06 minLecture3.51
-
Binding Labels to Input Field 05 minLecture3.52
-
Increasing Hit Area & Accessibility 04 minLecture3.53
-
Submitting HTML Forms 04 minLecture3.54
-
Adding Value to Database 04 minLecture3.55
-
Providing Default Value for Text Input 02 minLecture3.56
-
Section Quiz 10 minLecture3.57
-
Reset Button & Date Submission 07 minLecture3.58
-
Using Image as Submit Button 03 minLecture3.59
-
File Upload With HTML 03 minLecture3.60
-
Slider & Volume Control 02 minLecture3.61
-
Numeric Input Field 02 minLecture3.62
-
Search Field 03 minLecture3.63
-
Telephone Field 05 minLecture3.64
-
Appointment Booking & URL Input Field 05 minLecture3.65
-
Securing User Data With POST 07 minLecture3.66
-
Dropdown Menu 05 minLecture3.67
-
TextArea 03 minLecture3.68
-
Password Field 02 minLecture3.69
-
Adding a Color Palette 02 minLecture3.70
-
Grouping Forms 02 minLecture3.71
-
Forms & Javascript 02 minLecture3.72
-
Section Quiz 10 minLecture3.73
-
-
Advanced HTML 28
-
HTML Block-level Element 04 minLecture4.1
-
HTML Inline Elements 05 minLecture4.2
-
Block-level Elements Demo 03 minLecture4.3
-
Intro to HTML DIV & SPAN 03 minLecture4.4
-
Aligning a DIV Element 04 minLecture4.5
-
Positioning DIV Elements with Float 05 minLecture4.6
-
DIV as Inline-Block Element 02 minLecture4.7
-
CSS Flex Layout 04 minLecture4.8
-
Embedding Forms & Pages in HTML 05 minLecture4.9
-
Iframe Border 01 minLecture4.10
-
Iframe as Target Frame 02 minLecture4.11
-
Embedding YouTube in Your Website 04 minLecture4.12
-
Metadata – Keywords 05 minLecture4.13
-
Metadata – Author, Charset, Viewport 03 minLecture4.14
-
Responsive Images 07 minLecture4.15
-
HTML Entities 05 minLecture4.16
-
Non-Breaking Space 05 minLecture4.17
-
HTML Emojis 03 minLecture4.18
-
Responsive Images for Multiple Devices 06 minLecture4.19
-
Favicon 05 minLecture4.20
-
Hosting Your Own Video 08 minLecture4.21
-
Hosting Podcasts, Songs and Audio Files 05 minLecture4.22
-
Tools for Front-End Development – Getting Image 04 minLecture4.23
-
Tools for Front-End Development – Resizing Images 04 minLecture4.24
-
Tools for Front-End Development – Background remover & Circle Image 04 minLecture4.25
-
Brand Colors 05 minLecture4.26
-
Selecting Matching Colors 05 minLecture4.27
-
Checkpoint : Project 1 – A Personal Portfolio Website 10 minLecture4.28
-
-
Intro to CSS - Cascading Style Sheet 71
-
Intro to CSS & Precedence 08 minLecture5.1
-
CSS Syntax 06 minLecture5.2
-
CSS Class Selector 03 minLecture5.3
-
Target Selectors 03 minLecture5.4
-
Star & Grouping Selector 02 minLecture5.5
-
Comments & Colors 05 minLecture5.6
-
Background Color 05 minLecture5.7
-
Opacity 03 minLecture5.8
-
Background Image 02 minLecture5.9
-
Repeat & Positioning 05 minLecture5.10
-
Scrolling Images 02 minLecture5.11
-
CSS Shorthand 03 minLecture5.12
-
CSS Background Image Sizing 05 minLecture5.13
-
Expanding Border Color 06 minLecture5.14
-
Expanding Border Style 03 minLecture5.15
-
Border Radius 02 minLecture5.16
-
Margin 08 minLecture5.17
-
Padding 04 minLecture5.18
-
Width & Height 06 minLecture5.19
-
CSS Box Model 07 minLecture5.20
-
CSS Outline 04 minLecture5.21
-
Using Google Inspect With CSS 04 minLecture5.22
-
Layout Debugging with Pesticide 09 minLecture5.23
-
Text Styling – Inline Block 05 minLecture5.24
-
Text-Decoration 02 minLecture5.25
-
Using Line-through 05 minLecture5.26
-
Font Families 06 minLecture5.27
-
Choosing Fonts Based on Project Niche 03 minLecture5.28
-
How to Apply Websafe Fonts 06 minLecture5.29
-
Font Style, Weight & Variant 03 minLecture5.30
-
Font Pairing 04 minLecture5.31
-
Applying Font Pairing 02 minLecture5.32
-
Font Shorthand 02 minLecture5.33
-
Link Styling with CSS Props 03 minLecture5.34
-
Link Styling with States 05 minLecture5.35
-
Link Styling with Text Decoration 02 minLecture5.36
-
Advanced Link Styling 07 minLecture5.37
-
Unordered List Marker Styling 04 minLecture5.38
-
Ordered List Marker Styling 02 minLecture5.39
-
Image List Marker 02 minLecture5.40
-
Links to Nav with CSS 04 minLecture5.41
-
Display Property for Page Layout 04 minLecture5.42
-
Display Block, Inline & Flex 04 minLecture5.43
-
Inline-block vs Block 03 minLecture5.44
-
Display none Vs Visibility hidden 03 minLecture5.45
-
Position Property for Page Layout 06 minLecture5.46
-
Position Fixed 02 minLecture5.47
-
Position Absolute 02 minLecture5.48
-
Sticky Elements 02 minLecture5.49
-
CSS Opacity Property 03 minLecture5.50
-
Opacity on Hover 02 minLecture5.51
-
Opacity & Positioning 02 minLecture5.52
-
Z-index Minus One 03 minLecture5.53
-
Z-index Stacking 01 minLecture5.54
-
Handling Content Overflow 04 minLecture5.55
-
CSS Pseudo class 02 minLecture5.56
-
Pseudo Class on Div 02 minLecture5.57
-
Aligning Images in Div 02 minLecture5.58
-
Tooltip with Pseudo Class 04 minLecture5.59
-
Horizontal Nav Menu 06 minLecture5.60
-
Separating a Menu Item 03 minLecture5.61
-
Vertical Nav Bar 04 minLecture5.62
-
Positioning Vertical Nav Bar 03 minLecture5.63
-
CSS Dropdown 08 minLecture5.64
-
Dropdown Box 05 minLecture5.65
-
Dropdown Button with Links 09 minLecture5.66
-
Image Aspect Ratio 05 minLecture5.67
-
Image Dropdown 05 minLecture5.68
-
Horizontal Navigation Menu 05 minLecture5.69
-
Dropdown Navigation Menu 09 minLecture5.70
-
Image Gallery 07 minLecture5.71
-
-
Advanced CSS 49
-
CSS Transformation 06 minLecture6.1
-
3D Transformation 03 minLecture6.2
-
CSS Transition 05 minLecture6.3
-
Transition Speed Curve 02 minLecture6.4
-
Transition Delay 01 minLecture6.5
-
Transition Transform 02 minLecture6.6
-
Applying Style to Form Input 04 minLecture6.7
-
Styling Textarea 03 minLecture6.8
-
Grouping Forms With Div 04 minLecture6.9
-
Styling Submit Button 03 minLecture6.10
-
Color Form Input & Focus Pseudo-state 03 minLecture6.11
-
Border Styles for Forms 02 minLecture6.12
-
Search Input & Button Styling 02 minLecture6.13
-
Adding a Search icon 02 minLecture6.14
-
Animating an Input Field 02 minLecture6.15
-
Styling the Select Dropdown 02 minLecture6.16
-
Intro to CSS Animation 07 minLecture6.17
-
Applying Animation to Other Elements 01 minLecture6.18
-
Increasing Animation Range 01 minLecture6.19
-
Animating Multiple Properties 02 minLecture6.20
-
Animation Delay 02 minLecture6.21
-
Animation Iteration and Infinite Loop 02 minLecture6.22
-
Changing Motion Direction 02 minLecture6.23
-
Animation Speed Curve 01 minLecture6.24
-
Bouncing Effect 03 minLecture6.25
-
Animation Shortcut 02 minLecture6.26
-
Tooltip Advanced 08 minLecture6.27
-
Positioning Box Theory 05 minLecture6.28
-
Positioning Top & Bottom 02 minLecture6.29
-
Understanding Pseudo Elements 04 minLecture6.30
-
Pseudo-elements : First letter 01 minLecture6.31
-
Combining Pseudo-elements 01 minLecture6.32
-
Marker & Selection Pseudo-element 02 minLecture6.33
-
Before & After Pseudo-element 03 minLecture6.34
-
Creating a Speech Bubble 06 minLecture6.35
-
Positioning the Tooltip Arrow 04 minLecture6.36
-
Creating Image Thumbnails 03 minLecture6.37
-
Clickable Image Thumbnails 03 minLecture6.38
-
Rounded Images 01 minLecture6.39
-
Flipping Image 03 minLecture6.40
-
Text Over Image 05 minLecture6.41
-
Image Overlay 08 minLecture6.42
-
Centering Overlay Text 04 minLecture6.43
-
Box Overlay 04 minLecture6.44
-
Adjusting Box Overlay 03 minLecture6.45
-
Slide in Overlay | Implicit Vs Explicit Properties 07 minLecture6.46
-
Slide in Overlay – Sides 05 minLecture6.47
-
Pagination 06 minLecture6.48
-
Styling Pagination 04 minLecture6.49
-
-
Introduction to JavaScript 30
-
What is JavaScript? 02 minLecture7.1
-
Features & Applications of JavaScript 03 minLecture7.2
-
Development Environment 06 minLecture7.3
-
Linking JS Inline 03 minLecture7.4
-
Internal JS 03 minLecture7.5
-
External JS 06 minLecture7.6
-
What is Nodejs? 05 minLecture7.7
-
Installing Nodejs 03 minLecture7.8
-
Running Nodejs in VS Code 05 minLecture7.9
-
Installing a Local Server Environment 03 minLecture7.10
-
Benefits of Developing on a Local Server 05 minLecture7.11
-
Live Preview 02 minLecture7.12
-
Changing HTML Content with JS 07 minLecture7.13
-
Changing HTM Attr. Value with JS 04 minLecture7.14
-
Changing CSS with JS 02 minLecture7.15
-
Changing More CSS Properties 02 minLecture7.16
-
Using JS to Hide Elements 03 minLecture7.17
-
JS Syntax 05 minLecture7.18
-
Code Block 05 minLecture7.19
-
Variable Declaration & Initialization 06 minLecture7.20
-
Declaring, Initializing & Multiple Variables in a Statement 03 minLecture7.21
-
Varying Variables 02 minLecture7.22
-
Constant Variable 02 minLecture7.23
-
Identifier Rules 06 minLecture7.24
-
Assignment Vs Equal To 03 minLecture7.25
-
JS Comment 03 minLecture7.26
-
Understanding JS Data Types 04 minLecture7.27
-
Strings & Numbers 04 minLecture7.28
-
BigInt 04 minLecture7.29
-
Boolean 01 minLecture7.30
-
This content is protected, please login and enroll course to view this content!
Prev
What are Tags?
Next
Basic HTML Structure
Leave A Reply Cancel reply
You must be logged in to post a comment.
12 Comments
1. As a Front-end Developer, which technology will you use to add beautiful styles and colors when building a website?
CSS
2. What is a Hpertext Markup Language?
HTML is a language in which a document is made up of text that are linked to other pages (text or document) in the same site even another site.
3. What makes up a complete HTML Element?
Opening tag
content
closing tag
4. How do browsers know how to display the contents of a HTML document properly as a webpage?
A browser knows how to display the content of a webpage by looking at the different tags in the page (document) to know how to interpret it. By looking at these tags it will know if one is a heading or an ordinary paragraph
5. What extension do you add, when saving a HTML document?
.html
(1) CSS
(2) It is the standard language for creating webpages.
(3)-opening tag
-content
-closing tag
e.g Breaking news
(4)Browsers use tags to know how to display the contents of a HTML document properly as a webpage .
e.g displays headings
display paragraph 1
(5) We use the extension .html to save a HTML document.
(1) CSS
(2) It is the standard language for creating webpages
(3) opening tag ,content, closing tag
(4)Tags
(5).html
1. As a Front-end Developer, which technology will you use to add beautiful styles and colors when building a website? – Cascading Style Sheet (CSS)
2. What is a Hpertext Markup Language? – Hypertext Markup Language (HTML) is used to structure contents on the webpage. It uses tags to define elements and attributes to provide additional information about elements.
3. What makes up a complete HTML Element? – HTML element is made up of the opening tags, the closing tags and the element in between.
4. How do browsers know how to display the contents of a HTML document properly as a webpage? – Immediately the see the opening and closing tags either in the wordpad or notepad, their job is to interprete it as HTML documents on the webpage.
5. What extension do you add, when saving a HTML document? – The extention you add in saving a HTML document is dot html for example – MyFirstWebpage.html.
1. As a Front-end Developer, which technology will you use to add beautiful styles and colors when building a website?
Ans: CSS
2. What is a Hpertext Markup Language?
Ans: It is the standard language for creating web pages. Every webpage is a collection of Html elements which can further be broken down into tags that makes a webpage a webpage when executed.
3. What makes up a complete HTML Element?
Ans:
– opening tag
-tag name
-content
-Closing tag
4. How do browsers know how to display the contents of a HTML document properly as a webpage?
Ans: Html tags help web browser to know how to display properly as web pages.
5. What extension do you add, when saving a HTML document?
Ans: .html
1. As a Front-end Developer, which technology will you use to add beautiful styles and colors when building a website? Ans: CSS – Cascading Style Sheet
2. What is a Hypertext Markup Language? Ans: Hypertext Markup Language is a language use to build and describe web pages.
3. What makes up a complete HTML Element? Ans: The opening tag, the content and the closing tag.
4. How do browsers know how to display the contents of a HTML document properly as a webpage? Ans: The HTML tags instruct the web browser on how to display the content within the tag.
5. What extension do you add, when saving a HTML document? Ans: .html
1. To add beautiful styles and colours when building a website, a front-end developer uses CSS (Cascading Style Sheets).
2. HyperText Markup Language (HTML) is the standard markup language used to create web pages. It describes the structure of a webpage using a variety of tags and attributes to define elements such as headings, paragraphs, links, images, and so on.
3. A complete HTML element consists of:
– An opening tag (e.g., “ for a paragraph).
– Content (the text or other elements that the tag encloses).
– A closing tag (e.g., “ for a paragraph).
Example:
This is a paragraph.
4. The browser uses the structure and tags defined in the HTML to display the content correctly.
5. When saving a HTML document, you use the `.html` or `.htm` extension. For example, `index.html` or `about.htm`.
(1). CSS. Cascading style sheets.
(2). Is a language that define the structure and layout of a webpage.
(3). The opening tag, Body or content, closing tag.
(4). When the browsers sees the angle bracket called tag. They use the tag to identify HTML document.
(5). By adding dot HTML.
1). CSS is used to add beautiful colors and styles to a website.
2). hyperText Markup Language is the standard markup language for creating a web page. It uses symbols and codes inserted into files that are to be displayed on the internet.
3). A complete HTML is made up of 3 parts; opening tag, main text and closing tag.
4). By the action of the action of angle brackets tags.
5). The extension added when saving a HTML document is .html
1. CSS
2. HTML acts as a markup language that structures web content. When browsers interpret HTML documents, they transform them into interactive multimedia web pages that users can access and interact with.
3. opening tag ,content, closing tag
4.HTML tags instruct web browsers on how to display content correctly on web pages.
5. the extension is .html
1. Css
2. Hyper text markup language is a standard language for creating web pages
3. Opening tag,content and closing tag
4. With the help of tags
5. .html
1. CSS
2. HTML is the language in which webpages are written. This language make is possible for browser to read, interpret and display a web page in the desired format.
3. a.The opening tag + tag name
b.The content eg: National Grid Collapse
c. The closing tag + tag name
4. Browsers properly display HTML content by reading the HTML tag element, and displaying based on the tag name.
5. .html