Page Nav

HIDE

Gradient Skin

Gradient_Skin

Breaking News

latest

Basics Of Web Development : HTML CSS JS

WEB TECHNOLOGY         Web Technology Means The Way Computer Communicate With Users With The Help Of Mark-Up Languages & Multimedia Pac...



WEB TECHNOLOGY

Basics Of Web Development : HTML CSS JS


       Web Technology Means The Way Computer Communicate With Users With The Help Of Mark-Up Languages & Multimedia Packages On Web Pages On Websites. This website is Basically Designed With HTML CSS & JS. This language Makes a Website That Can be Understandable To Web Browser Of Computer. To Run CSS & JS On Web Browser, We Need To Use an HTML File & Link The CSS & JS Within It. HTML CSS & JS Only Makes The Static Web Pages. To Make a Dynamic Website Which Can Accept Value Or Details From The User We Need To Create Website With Back End Server-Side Languages Like PHP, ASP.NET, etc.


1.HTML :

Introduction:

  • The Full Form Of HTML Is HyperText Markup Language.
  • The Founder Of HTML is Tim Berners-Lee.
  • HTML Language Was Invented in 1990.

Uses Of HTML:

  • HTML is Used To Create Web Page Which Can Be Displayed On Web Browser.
  • HTML Is a Client-Side Language So It Uses To Store Data On Client Side Server.
  • HTML Supports To Creation Of Forms, Tables, Etc.
  • HTML Can Be Used To Add Images, Videos, Music & Other Media to Web Pages.
  • HTML Is a Very Easy Language To Learn So That Anyone Can Use HTML For Creating Basic HTML Web Pages. 

Format Of HTML:

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Document</title>

</head>
<body>

</body>
</html>

Basic Tags Of HTML:

Tag
Description

<!DOCTYPE> 
Defines the document type
<html>
Defines an HTML document
<head>
Contains metadata/information for the document
<title>
Defines a title for the document
<body>
Defines the document's body

<h1> to <h6>
Defines HTML headings
Defines a paragraph
<br>
Inserts a single line break

<hr>
Defines a thematic change in the content
<!--...-->
Defines a comment

Example Program Of HTML : Heading Text Using <h1> Tag.


<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <h1>This Is Heading</h1>

</body>


</html>


Output :


Document

This Is Heading

2.CSS :


Introduction:


  • The Full Form Of CSS Is Cascading Style Sheets.
  • The Founder Of CSS is Håkon Wium Lie.
  • CSS Language Was Invented On December 17, 1996.

Uses Of CSS:

  • CSS Is Used For Better Design Of Web Page.
  • CSS Is Used To Alignment Of Web Pages According To User Instructions.
  • CSS Makes The Web Pages Responsive For Multiple Devices Like Desktop's, Mobile Phones, I Pads, TV Screen.
  • CSS Makes The HTML Document To Look Better For Our Understanding.
  • CSS Used For Formatting The HTML Content & Text.    

Syntax & Types Of CSS:

  • Syntax : color: redtext-align: center; }
  • Here , P Is a Selector Of '<p>' Tag , 'Color' & 'text-align' is The CSS Property , 'red' & 'center' Are The Values Of That Property



  • CSS Can Be Applied in a Web Page By 3 Types :
  1. Inline CSS
  2. Internal CSS
  3. External CSS
  • Inline CSS is given In Between Tags Of HTML
  • Example :
<body>
  <p style="color:red;">
This is a paragraph.
</p>
</body>
  • Internal CSS Is Given in Between Of <style> Tags Within The <head> Tag.
  • Example : 
<head>
<style>
body {
  background-colorlinen;
}

h1 {
  colormaroon;
  margin-left40px;
}
</style>
</head>
  • External CSS Is Given in Title in <linl> Tag By Giving Path Of CSS File.
  • Example : 

<!DOCTYPE html>
<html>
<head>

<link rel="stylesheet"
type="text/css"
 href="mystyle.css">

</head>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>


3.JS :


Introduction:


  • The Full Form Of JS Is Java Script.
  • The Founder Of HTML is Brendan Eich.
  • HTML Language Was Invented in September 1995.


Uses Of JS:

  • Java Script Is Used For Client Side Scripting.
  • Java Script Is Used For Client Side Validation.
  • Java Script Is Used Event Handling & Calling Functions.

Elements In JS :

  • Variables :
In Java Script We Can Declare Variables By Using 'var' , 'const' & 'let' . 
Example : 
var a;
a = "Name";

const b = 10;

let c = true;

Here, We Don't Need To Declare Data Types Of Value, JavaScript is Clever Enough To Identify Data Types.
  • Operators :
  1. Arithmetic operators: Used For Mathematical Operations.
  2. Assignment operators: Used To Assign Values.
  3. Comparison operators: Used To Do Comparison. 
  4. Logical Operator: Used To Check Condition.
  5. Bitwise Operator: Any Numeric Operand In The Operation Is Converted Into a 32 Bit Number
  • Data Types :
Data Type
Description
1. String
Represents a sequence of characters e.g. "hello"
2. Number
Represents numeric values e.g. 100
3. Boolean
Represents boolean value either false or true
4. Undefined
Represents undefined value

5. Null
Represents null i.e. no value at all
6. Object
Represents instance through which we can access members
7. Array
Represents a group of similar values

8. RegExp
Represents regular expression

  • Functions :
Functions are the main “building blocks” of the program. They allow the code to be called many times without repetition.

Declaration Of Functions :
function showMessage() {
  alert'Hello everyone!');
}

  • Events :
Events Are The Options To Call a JavaScript Function On Some Specific Action.
  • Loops :
JavaScript Consist Of Certain Loops :
  • 1. For Loop :
for (statement 1; statement 2; statement 3) {

  // code block to be executed

}



// Statement 1 is executed (one time) before the execution of the code block.



// Statement 2 defines the condition for executing the code block.



// Statement 3 is executed (every time) after the code block has been executed. 
  • 2. While Loop :
while (condition) {

  // code block to be executed

}



// Loops can execute a block of code as long as a specified condition is true.
  • 3. Do While Loop :
do {

  // code block to be executed

}

while (condition);



/* The do/while loop is a variant of the while loop. This loop will execute the

 code block once, before checking if the condition is true, then it will repeat

  the loop as long as the condition is true. */


Example Of JavaScript Program: Addition Of Two Numbers :


Program :

<html>

  <head>

        <title>Add program</title>

        <script language="javascript">

                function addNumbers()

                {

                        var val1 = parseInt(document.getElementById("value1").value);

                        var val2 = parseInt(document.getElementById("value2").value);

                        var ansD = document.getElementById("answer");

                        ansD.value = val1 + val2;

                }

        </script>

  </head>

  <body>

        value1 = <input type="text" id="value1" name="value1" value=""/>

        value2 = <input type="text" id="value2" name="value2" value=""/>

        <input type="button" name="Sumbit" value="Click here"

         onclick="javascript:addNumbers()"/>

        Answer = <input type="text" id="answer" name="answer" value=""/>

  </body>

</html>

Output :



Add program value1 =
value2 =

Answer =

2 comments