Lecture 1 – Learn HTML & CSS
This easy learning of web design and development is powered by a software house located in Lahore and providing web design & development services in all cities of Pakistan: https://webseo.com.pk/
HTML stands for Hyper Text Markup Language.
HTML is root element and root element has two main child which is:
In the head section, we put external files like .CSS, JS, Bootstrap, Font Awesome, Google Fonts files and we can also do internal CSS by putting the <style> </style> element.
<html> HTML is grand parent of style and parent of head tag.
Content is what that is exist between opening and closing tags and when we write opening tag and add some content in it then then put closing tag then it becomes an elements so what that means is the set of opening tag and closing tag is an element.
example: <p> This is the content </p> now this is called an element.
There are three types of tags
- Opening tags <html>
- Closing tags </html>
- Self closing tags <br>
There are three types of elements
- Block Level Element
- Inline Element
- Semantic Element
Example of block level element:
It takes 100% width of its parent and the width of block level element can be changed
Example of Inline element:
The width of inline element can’t be changed, <span> is an example of an inline element.
in HTML 4 we used to use div
DIV = Division
in HTML classes we don’t use wide spaces because if wide spaces are used then it could be mean that is has two classes.
Then there some attributes or attribute name and attribute values are also used in HTML
CSS – Cascading Style Sheet
CSS stands for cascading style sheet ans we use css to style the content which is coded in HTML.
There are 3 types of CSS
- Inline CSS
- Internal CSS
- External CSS
To style in line we use inline css
To style a single page we can use <style> attribute in the head section of HTML page to style HTML
We create an external file and save it with the extension .css and then write css code in it and link this file in the head section of html
<link rel=”stylesheet” href=”style.css>
There are 4 types of selector in CSS
- Universal Selector
- ID selector
- Class selector
- Tag Selector
Universal Selector is selected by steric *
ID selector is selected by HASH # and ID is used for unique element
Class Selector is selected by DOT . and class is used for multiple elements
Tag Selector is directly selected by tag name
Now after selecting any id, class, tag we use properties and values in it
Now height is property name: and 200px; is property value.
Then we can also use short hand properties
Example of short hand property is
border: 5px solid;
Now what we did is we have given two property values to property border.
More lectures about HTML will be uploaded soon.