0% found this document useful (0 votes)
2 views

What-is-HTML

learning notes

Uploaded by

jessica.bucton20
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views

What-is-HTML

learning notes

Uploaded by

jessica.bucton20
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

What is HTML?

HTML stands for Hyper Text Markup Language


HTML is the standard markup language for creating Web pages

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 label pieces of content such as "this is a heading", "this is a paragraph", "this is a link",
etc.

A Simple HTML Document

Example
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>


<p>My first paragraph.</p>

</body>
</html>

Explaination

• The <!DOCTYPE html> declaration defines that this document is an HTML5 document
• The <html> element is the root element of an HTML page
• The <head> element contains meta information about the HTML page
• The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in
the page's tab)
• The <body> element defines the document's body, and is a container for all the visible contents, such as
headings, paragraphs, images, hyperlinks, tables, lists, etc.
• The <h1> element defines a large heading
• The <p> element defines a paragraph

What is an HTML Element?

An HTML element is defined by a start tag, some content, and an end tag:
<tagname> Content goes here... </tagname>

The HTML element is everything from the start tag to the end tag:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
Start Tag Element content End Tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none

Note: Some HTML elements have no content (like the <br> element). These elements are called empty
elements. Empty elements do not have an end tag!
Web Browsers
The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them
correctly.

A browser does not display the HTML tags, but uses them to determine how to display the document:

HTML Page Structure

Below is a visualization of an HTML page structure:

<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>

Note: The content inside the <body> section will be displayed in a browser. The content inside the <title>
element will be shown in the browser's title bar or in the page's tab.

HTML Table Tags

Tag Description

<table> Defines a table

<th> Defines a header cell in a table


<tr> Defines a row in a table

<td> Defines a cell in a table

<caption> Defines a table caption

<colgroup> Specifies a group of one or more columns in a table for formatting

<col> Specifies column properties for each column within a <colgroup> element

<thead> Groups the header content in a table

<tbody> Groups the body content in a table

<tfoot> Groups the footer content in a table

HTML tables can have borders of different styles and shapes.


How To Add a Border
To add a border, use the CSS border property on table, th, and td elements:

Example
table, th, td {
border: 1px solid black;
}
Collapsed Table Borders
To avoid having double borders like in the example above, set the CSS border-collapse property to collapse.
This will make the borders collapse into a single border:

Example

table, th, td {
border: 1px solid black;
border-collapse: collapse;
}

With the border-style property, you can set the appearance of the border.

The following values are allowed:

• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset
• none
• hidden

HTML Form
An HTML form is used to collect user input. The user input is most often sent to a server for processing.
The <form> Element

The HTML <form> element is used to create an HTML form for user input:
<form>
.
form elements
.
</form>
The <form> element is a container for different types of input elements, such as: text fields, checkboxes, radio
buttons, submit buttons, etc.
All the different form elements are covered in this chapter: HTML Form Elements.

The <input> Element

The HTML <input> element is the most used form element.


An <input> element can be displayed in many ways, depending on the type attribute.
HTML Input Types
Here are the different input types you can use in HTML:

<input type="button"> <input type="text">


<input type="checkbox"> <input type="time">

<input type="color"> <input type="url">

<input type="date"> <input type="week">


<input type="datetime-local">

<input type="email">
<input type="file">

<input type="hidden">
<input type="image">
<input type="month">

<input type="number">
<input type="password">

<input type="radio">
<input type="range">

<input type="reset">

<input type="search">
<input type="submit">

<input type="tel">
Input Type Text

<input type="text"> defines a single-line text input field.


Input Type Submit

<input type="submit"> defines a button for submitting form data to a form-handler.


The form-handler is typically a server page with a script for processing input data.

Input Type Reset

<input type="reset"> defines a reset button that will reset all form values to their default values.
Input Type Button

<input type="button"> defines a button.


Input Type Color

The <input type="color"> is used for input fields that should contain a color.
Depending on browser support, a color picker can show up in the input field.
Input Type Date

The <input type="date"> is used for input fields that should contain a date.
Depending on browser support, a date picker can show up in the input field.
You can also use the min and max attributes to add restrictions to dates
Input Type Email

The <input type="email"> is used for input fields that should contain an e-mail address.

What is CSS?
CSS stands for Cascading Style Sheets

CSS describes how HTML elements are to be displayed on screen, paper, or in other media
CSS saves a lot of work. It can control the layout of multiple web pages all at once

External stylesheets are stored in CSS files

Why Use CSS?

CSS is used to define styles for your web pages, including the design, layout and variations in display for
different devices and screen sizes.

CSS Syntax

A CSS rule consists of a selector and a declaration block

The selector points to the HTML element you want to style.

The declaration block contains one or more declarations separated by semicolons.


Each declaration includes a CSS property name and a value, separated by a colon.

Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded by curly
braces.
Example

In this example, all <p> elements will be center-aligned, with a red text color:
p {color: red; text-align: center;}

Example Explained
p is a selector in CSS (it points to the HTML element you want to style: <p>).

color is a property, and red is the property value

text-align is a property, and center is the property value

What is PHP?
PHP is an acronym for "PHP: Hypertext Preprocessor"

PHP is a widely-used, open source scripting language


PHP scripts are executed on the server

PHP is free to download and use

What is a PHP File?


PHP files can contain text, HTML, CSS, JavaScript, and PHP code

PHP code is executed on the server, and the result is returned to the browser as plain HTML
PHP files have extension “.php”

What Can PHP Do?

PHP can generate dynamic page content


PHP can create, open, read, write, delete, and close files on the server

PHP can collect form data


PHP can send and receive cookies

PHP can add, delete, modify data in your database


PHP can be used to control user-access

PHP can encrypt data


With PHP you are not limited to output HTML. You can output images or PDF files. You can also output any text,
such as XHTML and XML.

Note: PHP statements end with a semicolon (;).

PHP Variables

A variable can have a short name (like $x and $y) or a more descriptive name ($age, $carname, $total_volume).
Rules for PHP variables:

A variable starts with the $ sign, followed by the name of the variable
A variable name must start with a letter or the underscore character

A variable name cannot start with a number


A variable name can only contain alpha-numeric characters and underscores (A-z, 0-9, and _ )
Variable names are case-sensitive ($age and $AGE are two different variables)

PHP Data Types

Variables can store data of different types, and different data types can do different things.
PHP supports the following data types:

• String
• Integer
• Float (floating point numbers - also called double)
• Boolean
• Array
• Object
• NULL
• Resource

PHP String
A string is a sequence of characters, like "Hello world!".
A string can be any text inside quotes. You can use single or double quotes:

PHP Integer
An integer data type is a non-decimal number between -2,147,483,648 and 2,147,483,647.

Rules for integers:

• An integer must have at least one digit


• An integer must not have a decimal point
• An integer can be either positive or negative
• Integers can be specified in: decimal (base 10), hexadecimal (base 16), octal (base 8), or binary (base 2)
notation
PHP Float

A float (floating point number) is a number with a decimal point or a number in exponential form.
PHP Boolean
A Boolean represents two possible states: TRUE or FALSE.

PHP Array
An array stores multiple values in one single variable.

What is an Array?

An array is a special variable that can hold many values under a single name, and you can access the values by
referring to an index number or name.

PHP Object

Classes and objects are the two main aspects of object-oriented programming.
A class is a template for objects, and an object is an instance of a class.

When the individual objects are created, they inherit all the properties and behaviors from the class, but each
object will have different values for the properties.
PHP NULL Value
Null is a special data type which can have only one value: NULL.

A variable of data type NULL is a variable that has no value assigned to it.
Tip: If a variable is created without a value, it is automatically assigned a value of NULL.

Variables can also be emptied by setting the value to NULL:

PHP Error and Logging Functions


Function Description

debug_backtrace() Generates a backtrace

debug_print_backtrace() Prints a backtrace

error_clear_last() Clears the last error

error_get_last() Returns the last error that occurred

error_log() Sends an error message to a log, to a file, or to a mail account

error_reporting() Specifies which errors are reported

restore_error_handler() Restores the previous error handler

restore_exception_handler() Restores the previous exception handler

set_error_handler() Sets a user-defined error handler function

set_exception_handler() Sets a user-defined exception handler function

trigger_error() Creates a user-level error message

user_error() Alias of trigger_error()

PHP Predefined Error and Logging Constants

Value Constant Description


1 E_ERROR Fatal run-time errors. Errors that cannot be recovered from.
Execution of the script is halted
2 E_WARNING Run-time warnings (non-fatal errors). Execution of the script is not
halted
4 E_PARSE Compile-time parse errors. Parse errors should only be generated
by the parser
8 E_NOTICE Run-time notices. The script found something that might be an
error, but could also happen when running a script normally
16 E_CORE_ERROR Fatal errors at PHP startup. This is like E_ERROR, except it is
generated by the core of PHP
32 E_CORE_WARNING Non-fatal errors at PHP startup. This is like E_WARNING, except it is
generated by the core of PHP
64 E_COMPILE_ERROR Fatal compile-time errors. This is like E_ERROR, except it is
generated by the Zend Scripting Engine
128 E_COMPILE_WARNING Non-fatal compile-time errors. This is like E_WARNING, except it is
generated by the Zend Scripting Engine
256 E_USER_ERROR Fatal user-generated error. This is like E_ERROR, except it is
generated in PHP code by using the PHP function trigger_error()
512 E_USER_WARNING Non-fatal user-generated warning. This is like E_WARNING, except
it is generated in PHP code by using the PHP function
trigger_error()
1024 E_USER_NOTICE User-generated notice. This is like E_NOTICE, except it is generated
in PHP code by using the PHP function trigger_error()
2048 E_STRICT Enable to have PHP suggest changes to your code which will ensure
the best interoperability and forward compatibility of your code
(Since PHP 5 but not included in E_ALL until PHP 5.4)
4096 E_RECOVERABLE_ERROR Catchable fatal error. Indicates that a probably dangerous error
occurred, but did not leave the Engine in an unstable state. If the
error is not caught by a user defined handle, the application aborts
as it was an E_ERROR (Since PHP 5.2)
8192 E_DEPRECATED Run-time notices. Enable this to receive warnings about code that
will not work in future versions (Since PHP 5.3)
16384 E_USER_DEPRECATED User-generated warning message. This is like E_DEPRECATED,
except it is generated in PHP code by using the PHP function
trigger_error() (Since PHP 5.3)
32767 E_ALL Enable all PHP errors and warnings (except E_STRICT in versions <
5.4)

What is SQL?
SQL is the standard query language for dealing with Relational Databases.

SQL is used to insert, search, update, and delete database records.

The MySQL SELECT Statement


The SELECT statement is used to select data from a database.

The data returned is stored in a result table, called the result-set.


SELECT * FROM table_name;

The MySQL WHERE Clause


The WHERE clause is used to filter records.

It is used to extract only those records that fulfill a specified condition.

SELECT * FROM Customers WHERE Country = 'Mexico';


The MySQL AND, OR and NOT Operators

The WHERE clause can be combined with AND, OR, and NOT operators.
The AND and OR operators are used to filter records based on more than one condition:

The AND operator displays a record if all the conditions separated by AND are TRUE.

The OR operator displays a record if any of the conditions separated by OR is TRUE.


The NOT operator displays a record if the condition(s) is NOT TRUE.
The MySQL INSERT INTO Statement
The INSERT INTO statement is used to insert new records in a table.

INSERT INTO table_name (column1, column2, column3, ...) VALUES (value1, value2, value3, ...);
What is a NULL Value?

A field with a NULL value is a field with no value.


If a field in a table is optional, it is possible to insert a new record or update a record without adding a value to
this field. Then, the field will be saved with a NULL value.
Note: A NULL value is different from a zero value or a field that contains spaces. A field with a NULL value is
one that has been left blank during record creation!
IS NULL Syntax
SELECT column_names FROM table_name WHERE column_name IS NULL;

IS NOT NULL Syntax


SELECT column_names FROM table_name WHERE column_name IS NOT NULL;

The MySQL UPDATE Statement


The UPDATE statement is used to modify the existing records in a table.

UPDATE table_name SET column1 = value1, column2 = value2, ... WHERE condition;

Note: Be careful when updating records in a table! Notice the WHERE clause in the UPDATE statement. The
WHERE clause specifies which record(s) that should be updated. If you omit the WHERE clause, all records in
the table will be updated!
The MySQL DELETE Statement

The DELETE statement is used to delete existing records in a table.

DELETE FROM table_name WHERE condition;


Note: Be careful when deleting records in a table! Notice the WHERE clause in the DELETE statement. The
WHERE clause specifies which record(s) should be deleted. If you omit the WHERE clause, all records in the
table will be deleted

Definition and Usage


The getTrace() method returns a stack trace in the form of an array.

Stack traces contain information about all of the functions that are running at a given moment. The stack trace
provided by this method has information about the stack at the time that the exception was thrown.
Syntax
$exception->getTrace()
Technical Details

Return Value: Returns a stack trace in the form of an array

You might also like