Download HTML Fundamentals. ^_^ and more Summaries Computer Fundamentals in PDF only on Docsity!
What is HTML?
HTML (HyperText Markup Language)is the most basic building block of the Web. It describes and defines the content of a webpage along with the basic layout of the webpage
HTML stands for Hyper Text Markup Language HTML describes the structure of a Web page HTML consists of a series of elements HTML elements tell the browser how to display the content HTML elements are represented by tags HTML tags label pieces of content such as "heading", "paragraph", "table", and so on Browsers do not display the HTML tags, but use them to render the content of the page
HTML Page Structure
Below is a visualization of an HTML page structure:
A Simple HTML Document
Page Title
My First Heading
My first paragraph.
Output:
My First Heading
My first paragraph.
Basic HTML
Tag Description
** Defines the document type**
** Defines an HTML document**
Email id:
Output :
Input Element in HTML Forms :
Input Elements are the most common elements which are used in HTML Forms. Various user input fields can be created such as textfield, check box, password field, radio button, submit button etc. The most common input elements are listed below:
1. Text Field in HTML Forms :
The text field is a one line input field allowing the user to input text. Text Field input controls are created using the “input” element with a type attribute having value as “text”.
Attributes
Following is the list of attributes for tag for creating text field.
Sr.No (^) Attribute Description
1 Type^ Indicates^ the^ type^ of^ input^ control^ and^ for text input control it will be set to text.
2 Name^ Used to give a name to the control which is sent to the server to be recognized and get the value.
3 Value^ This can be used to provide an initial value inside the control.
4 Size^ Allows to specify the width of the text-input
control in terms of characters.
5 Maxlength^ Allows to specify the maximum number of
characters a user can enter into the text box.
Example:
Example Of Text Field
Email Id:
Output:
the value.
3 Value^ This can be used to provide an initial value inside the control.
4 Size^ Allows^ to^ specify^ the^ width^ of^ the^ text-input
control in terms of characters.
5 Maxlength^ Allows to specify the maximum number of
characters a user can enter into the text box.
Example:
Example of Password Field
Password:
Output:
3.Radio Buttons in HTML Form :
Radio Buttons are used to let the user select exactly one option from a list of predefined options. Radio Button input controls are created using the “input” element with a type attribute having value as “radio”.
Attributes
Following is the list of attributes for radio button.
Sr.No (^) Attribute Description
1 Type^ Indicates the type of input control and for checkbox input control it will be set to Radio.
2 Name^ Used to give a name to the control which is sent to the server to be recognized and get the value.
3 Value^ The value that will be used if the radio box is selected.
4 Checked^ Set to checked if you want to select it by default.
Example:
Example of Radio Buttons
SELECT GENDER
Male
selected.
4 Checked^ Set to checked if you want to select it by default.
Example:
Example of HTML Checkboxes
SELECT SUBJECTS
Maths
Science
English
Output:
Select Box Control
A select box, also called drop down box which provides option to list down various options in the form of drop down list, from where a user can select one or more options.
Attributes
Following is the list of important attributes of tag –
Sr.No (^) Attribute Description
1 Name^ Used to give a name to the control which is send to the server to be recognized and get the value.
2 Size^ This can be used to present a scrolling list box.
3 Multiple^ If^ set^ to^ “multiple”^ then^ allows^ a^ user^ to select multiple items from the menu.
Following is the list of important attributes of
File Upload Box
If you want to allow a user to upload a file to your web site, you will need to use a file upload box, also known as a file select box. This is also created using the element but type attribute is set to file.
Attributes
Following is the list of important attributes of file upload box –
Sr.No (^) Attribute Description
1 Name^ Used to give a name to the control which is sent to the server to be recognized and get the value.
2 Accept^ Specifies the types of files that the server accepts.
Example: Here is example HTML code for a form with one file upload box
File Upload Box
Output:
Button Controls
There are various ways in HTML to create clickable buttons. You can also create a clickable button using tag by setting its type attribute to button. The type attribute can take the following values –
Sr.No (^) Attribute Description
Output:
Submit Reset Ok
Hidden Form Controls
Hidden form controls are used to hide data inside the page which later on can be pushed to the server. This control hides inside the code and does not appear on the actual page. For example, following hidden form is being used to keep current page number. When a user will click next page then the value of hidden control will be sent to the web server and there it will decide which page will be displayed next based on the passed current page.
Example:
Here is example HTML code to show the usage of hidden control –
File Upload Box
This is page 10
Output:
This is page 10
Submit Reset
The GET Method
GET is used to request data from a specified resource.
GET is one of the most common HTTP methods.
Note that the query string (name/value pairs) is sent in the URL of a GET request:
/test/demo_form.php?name1=value1&name2=value
Some other notes on GET requests:
GET requests can be cached GET requests remain in the browser history GET requests can be bookmarked GET requests should never be used when dealing with sensitive data GET requests have length restrictions GET requests is only used to request data (not modify)
The POST Method
POST is used to send data to a server to create/update a resource.
The data sent to the server with POST is stored in the request body of the HTTP request:
POST /test/demo_form.php HTTP/1. Host: w3schools.com name1=value1&name2=value
POST is one of the most common HTTP methods.
Some other notes on POST requests:
POST requests are never cached POST requests do not remain in the browser history POST requests cannot be bookmarked POST requests have no restrictions on data length
Advantages and Disadvantages of Using the POST Method
It is more secure than GET because user-entered information is
never visible in the URL query string or in the server logs.
There is a much larger limit on the amount of data that can be
passed and one can send text data as well as binary data (uploading a file) using POST.
Since the data sent by the POST method is not visible in the
URL, so it is not possible to bookmark the page with specific query.
Example:
Example of PHP POST method
Hi, ". $_POST["name"]. "
";
}
?>
">
Name:
PHP Super Global Variables
