HTML5 introduces a number of new elements and attributes that helps in building a modern websites. This presentation explains new great features introduced in HTML5.
HTML5 introduces a number of new elements and attributes that helps in building a modern websites. This presentation explains new great features introduced in HTML5.
This presentation is an introduction to the new features of
HTML5. The main elements of this document are:
* Brief history of HTML5
*The improvements
* Browser support
* Semantic elements
* Content Editable on pages
* Video Tag
* Canvas tag
* Local storage
* Geolocation API
* Offline applications
* Microdata
* Use cases
This is a brief introduction about HTML5. You will learn that what is new in HTML5. I will tell what and when changes happened in HTML which Hyper Text markup language. Html is a language which is used to create web pages that we have seen on the internet. For website development and web hosting visit https://tekfold.com
HTML5: An Introduction To Next Generation Web DevelopmentTilak Joshi
This slideshow provides an introduction to HTML5. The target audience should have an understanding of web development, javascript, and previous standards of HTML. This tutorial contains a brief background on the language and an overview of the most popular features. Features covered include native audio/video support, geolocation, canvas, drawing API, web forms 2.0, drag and drop, and more. Also covered is backwards compatibility and section 508 compliance. Extras include polyfills, modernizr, and a brief introduction to CSS3. Enjoy!
HTML5 is a language for structuring and presenting content for the World Wide Web. it is the fifth revision of the HTML standard (created in 1990 and standardized as HTML4 as of 1997) and as of February 2012 is still under development. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.). It improves interoperability and reduces development costs by making precise rules on how to handle all HTML elements, and how to recover from errors
Reactive Type safe Webcomponents with skateJSMartin Hochel
This was presented at GUG Prague js dev meetup www.gug.cz/cs/akce/reactive-type-safe-webcomponents/terminy/1
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk I will do an overview of component creation in terms of re-usability followed up with real life examples how to create performant, reactive, small and type-safe web components with tiny superpowered library called SkateJS.
Write once, use everywhere by using the platform.
Source code: https://github.com/Hotell/reactive-typesafe-webcomponents
SkateJS: https://github.com/skatejs/skatejs
DevFest Makerere html5 presentation by caesar mukamaEmily Karungi
This presentation explains the relevance of using HTML5 which is one of the Google technologies. It's a basic tutorial designed to encourage students to use HTML5 when developing applications.
HTML5 Tutorial For Beginners - Learning HTML 5 in simple and easy steps with examples covering 2D Canvas, Audio, Video, New Semantic Elements, Geolocation, Persistent Local Storage, Web Storage, Forms Elements,Application Cache,Inline SVG,Document
Web Visualization with HTML5, CSS3, and JavaScript is the course with the rapidly changing web development technologies, it has become important to stay in line with them to progress within the industry, which is why this course in web virtualization has been brought to you to spruce up your web designing and animating skills using HTML5, CSS3, and JavaScript. The latest features of HTML5, CSS3 and JavaScript are set to be provided to you through this course, hence, it is desired that you have basic knowledge on these programming languages for a smoother learning experience. This course will start off by walking you through the CSS3 virtualization techniques to design and animate webs. You will be taught how to create a 3D element using CSS transition and to transform animates into 2D and 3D, along with an insight into the elements of scalable vector graphics which is needed to create basic images and polygons and to animate. Our tutors will further take you through the canvas aspects of HTML5 to start drawing grids and animations using it. You will also get to learn how to create a callback and create and activate a queue that is needed in animating and the animation libraries that will be essential to your web designing projects. By the end of this course, you will have an outstanding knowledge of web visualization using HTML5, CSS3, and JavaScript to secure yourself a prominent place within the web development industry.
Be Less Terrible at the Business of DesignMeagan Fisher
The lessons I’ve learned about getting the work I want, ensuring a project is a success, and getting paid for it when it's done. And how being a better business person has also made me a better human being.
This presentation is an introduction to the new features of
HTML5. The main elements of this document are:
* Brief history of HTML5
*The improvements
* Browser support
* Semantic elements
* Content Editable on pages
* Video Tag
* Canvas tag
* Local storage
* Geolocation API
* Offline applications
* Microdata
* Use cases
This is a brief introduction about HTML5. You will learn that what is new in HTML5. I will tell what and when changes happened in HTML which Hyper Text markup language. Html is a language which is used to create web pages that we have seen on the internet. For website development and web hosting visit https://tekfold.com
HTML5: An Introduction To Next Generation Web DevelopmentTilak Joshi
This slideshow provides an introduction to HTML5. The target audience should have an understanding of web development, javascript, and previous standards of HTML. This tutorial contains a brief background on the language and an overview of the most popular features. Features covered include native audio/video support, geolocation, canvas, drawing API, web forms 2.0, drag and drop, and more. Also covered is backwards compatibility and section 508 compliance. Extras include polyfills, modernizr, and a brief introduction to CSS3. Enjoy!
HTML5 is a language for structuring and presenting content for the World Wide Web. it is the fifth revision of the HTML standard (created in 1990 and standardized as HTML4 as of 1997) and as of February 2012 is still under development. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.). It improves interoperability and reduces development costs by making precise rules on how to handle all HTML elements, and how to recover from errors
Reactive Type safe Webcomponents with skateJSMartin Hochel
This was presented at GUG Prague js dev meetup www.gug.cz/cs/akce/reactive-type-safe-webcomponents/terminy/1
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk I will do an overview of component creation in terms of re-usability followed up with real life examples how to create performant, reactive, small and type-safe web components with tiny superpowered library called SkateJS.
Write once, use everywhere by using the platform.
Source code: https://github.com/Hotell/reactive-typesafe-webcomponents
SkateJS: https://github.com/skatejs/skatejs
DevFest Makerere html5 presentation by caesar mukamaEmily Karungi
This presentation explains the relevance of using HTML5 which is one of the Google technologies. It's a basic tutorial designed to encourage students to use HTML5 when developing applications.
HTML5 Tutorial For Beginners - Learning HTML 5 in simple and easy steps with examples covering 2D Canvas, Audio, Video, New Semantic Elements, Geolocation, Persistent Local Storage, Web Storage, Forms Elements,Application Cache,Inline SVG,Document
Web Visualization with HTML5, CSS3, and JavaScript is the course with the rapidly changing web development technologies, it has become important to stay in line with them to progress within the industry, which is why this course in web virtualization has been brought to you to spruce up your web designing and animating skills using HTML5, CSS3, and JavaScript. The latest features of HTML5, CSS3 and JavaScript are set to be provided to you through this course, hence, it is desired that you have basic knowledge on these programming languages for a smoother learning experience. This course will start off by walking you through the CSS3 virtualization techniques to design and animate webs. You will be taught how to create a 3D element using CSS transition and to transform animates into 2D and 3D, along with an insight into the elements of scalable vector graphics which is needed to create basic images and polygons and to animate. Our tutors will further take you through the canvas aspects of HTML5 to start drawing grids and animations using it. You will also get to learn how to create a callback and create and activate a queue that is needed in animating and the animation libraries that will be essential to your web designing projects. By the end of this course, you will have an outstanding knowledge of web visualization using HTML5, CSS3, and JavaScript to secure yourself a prominent place within the web development industry.
Be Less Terrible at the Business of DesignMeagan Fisher
The lessons I’ve learned about getting the work I want, ensuring a project is a success, and getting paid for it when it's done. And how being a better business person has also made me a better human being.
In this lecture, I provide an overview of what it takes to create amazing Web Apps : rich media, the Canvas API, local storage and offline persistence are covered.
Today’s designers when asked about HTML5 do hesitate to answer because of the lack of knowledge about HTML5.A Free Ebook On HTML 5 Step by Step Guide..
C# Corner Delhi Chapter announces its first monthly chapter meet for students.
On 20th September, prepare yourself for Industries, Interviews and Learn HTML5
http://www.c-sharpcorner.com/Events/104/delhi-students-day-prepare-yourself-for-industries-interv.aspx
Read| The latest issue of The Challenger is here! We are thrilled to announce that our school paper has qualified for the NATIONAL SCHOOLS PRESS CONFERENCE (NSPC) 2024. Thank you for your unwavering support and trust. Dive into the stories that made us stand out!
2024.06.01 Introducing a competency framework for languag learning materials ...Sandy Millin
http://sandymillin.wordpress.com/iateflwebinar2024
Published classroom materials form the basis of syllabuses, drive teacher professional development, and have a potentially huge influence on learners, teachers and education systems. All teachers also create their own materials, whether a few sentences on a blackboard, a highly-structured fully-realised online course, or anything in between. Despite this, the knowledge and skills needed to create effective language learning materials are rarely part of teacher training, and are mostly learnt by trial and error.
Knowledge and skills frameworks, generally called competency frameworks, for ELT teachers, trainers and managers have existed for a few years now. However, until I created one for my MA dissertation, there wasn’t one drawing together what we need to know and do to be able to effectively produce language learning materials.
This webinar will introduce you to my framework, highlighting the key competencies I identified from my research. It will also show how anybody involved in language teaching (any language, not just English!), teacher training, managing schools or developing language learning materials can benefit from using the framework.
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...Levi Shapiro
Letter from the Congress of the United States regarding Anti-Semitism sent June 3rd to MIT President Sally Kornbluth, MIT Corp Chair, Mark Gorenberg
Dear Dr. Kornbluth and Mr. Gorenberg,
The US House of Representatives is deeply concerned by ongoing and pervasive acts of antisemitic
harassment and intimidation at the Massachusetts Institute of Technology (MIT). Failing to act decisively to ensure a safe learning environment for all students would be a grave dereliction of your responsibilities as President of MIT and Chair of the MIT Corporation.
This Congress will not stand idly by and allow an environment hostile to Jewish students to persist. The House believes that your institution is in violation of Title VI of the Civil Rights Act, and the inability or
unwillingness to rectify this violation through action requires accountability.
Postsecondary education is a unique opportunity for students to learn and have their ideas and beliefs challenged. However, universities receiving hundreds of millions of federal funds annually have denied
students that opportunity and have been hijacked to become venues for the promotion of terrorism, antisemitic harassment and intimidation, unlawful encampments, and in some cases, assaults and riots.
The House of Representatives will not countenance the use of federal funds to indoctrinate students into hateful, antisemitic, anti-American supporters of terrorism. Investigations into campus antisemitism by the Committee on Education and the Workforce and the Committee on Ways and Means have been expanded into a Congress-wide probe across all relevant jurisdictions to address this national crisis. The undersigned Committees will conduct oversight into the use of federal funds at MIT and its learning environment under authorities granted to each Committee.
• The Committee on Education and the Workforce has been investigating your institution since December 7, 2023. The Committee has broad jurisdiction over postsecondary education, including its compliance with Title VI of the Civil Rights Act, campus safety concerns over disruptions to the learning environment, and the awarding of federal student aid under the Higher Education Act.
• The Committee on Oversight and Accountability is investigating the sources of funding and other support flowing to groups espousing pro-Hamas propaganda and engaged in antisemitic harassment and intimidation of students. The Committee on Oversight and Accountability is the principal oversight committee of the US House of Representatives and has broad authority to investigate “any matter” at “any time” under House Rule X.
• The Committee on Ways and Means has been investigating several universities since November 15, 2023, when the Committee held a hearing entitled From Ivory Towers to Dark Corners: Investigating the Nexus Between Antisemitism, Tax-Exempt Universities, and Terror Financing. The Committee followed the hearing with letters to those institutions on January 10, 202
How to Make a Field invisible in Odoo 17Celine George
It is possible to hide or invisible some fields in odoo. Commonly using “invisible” attribute in the field definition to invisible the fields. This slide will show how to make a field invisible in odoo 17.
Instructions for Submissions thorugh G- Classroom.pptxJheel Barad
This presentation provides a briefing on how to upload submissions and documents in Google Classroom. It was prepared as part of an orientation for new Sainik School in-service teacher trainees. As a training officer, my goal is to ensure that you are comfortable and proficient with this essential tool for managing assignments and fostering student engagement.
The French Revolution, which began in 1789, was a period of radical social and political upheaval in France. It marked the decline of absolute monarchies, the rise of secular and democratic republics, and the eventual rise of Napoleon Bonaparte. This revolutionary period is crucial in understanding the transition from feudalism to modernity in Europe.
For more information, visit-www.vavaclasses.com
3. Presentation Agenda:
HTML5
◦ Introduction of HTML5
◦ Elements
◦ Canvas
◦ SVG
◦ Drag/Drop
◦ Geo-location
◦ Video
◦ Audio
◦ Form handling
◦ SSE
3
4. Presentation Agenda
Continued..
PHP
◦ Server side Page with PHP
◦ Issues will be discussed
◦ PHP syntax
◦ Defining variables in php
PHP String:
◦ Definition of Strings in PHP
◦ Complete server-side page using php
strings and variables.
4
6. HTML5 is The New HTML Standard
HTML5 is designed to deliver almost
everything you want to do online without
requiring additional plug-ins. It does
everything from animation to apps, music to
movies, and can also be used to build
complicated applications that run in your
browser.
HTML5 is also cross-platform (it does not
care whether you are using a tablet or a
Smartphone, a net book, notebook or a
Smart TV).
Introduction of HTML5:
6
7. Continued..
HTML5 can also be used to write web applications that
still work when you are not online
Some of the most interesting new features in HTML5:
◦ The <canvas> element for 2D drawing
◦ The <video> and <audio> elements for media playback
◦ Support for local storage
New content-specific elements, like
<article>, <footer>, <header>, <nav>(The <nav> tag
defines a set of navigation links. NOT all links of a
document should be inside a <nav> element. The
<nav> element is intended only for major block
of navigation links.)
◦ New form controls, like
calendar, date, time, email, url, search
7
8. Elements
HTML Element Syntax
◦ An HTML element starts with a start tag /
opening tag
◦ An HTML element ends with an end tag /
closing tag
<P> for example this is a html element.
8
12. Bdi Tag:
<ul>
<li>User <bdi>hrefs</bdi>: 60 points</li>
<li>User <bdi>jdoe</bdi>: 80 points</li>
<li>User <bdi> </bdi>: 90 points</li>
</ul>
The HTML <bdi> tag is used on a span of text that is to be
isolated from its surroundings for the purposes of bidirectional
text formatting.
This can be useful when displaying right-to-left text (such as
Arabic) inside left-to-right text (such as English) when the
text-direction is unknown.
The <bdi> element allows you to honor the correct
directionality of text when this is unknown
12
13. Nav Tag :
The <nav> tag defines a set of
navigation links.
Notice that NOT all links of a
document should be inside a <nav>
element. The <nav> element is
intended only for major block
of navigation links.
13
15. 15
Canvas
What is Canvas?
◦ The HTML5 <canvas> element is used to
draw graphics.
◦ The <canvas> element is only a container
(Container tags are tags that you place on
your site to trigger not one, but many
other tags) for graphics. You must use a
script to actually draw the graphics.
◦ Canvas has several methods for drawing
paths, boxes, circles, text, and adding
images.
16. Convas Continued..
◦ A canvas is a rectangular area on an
HTML page, and it is specified with the
<canvas> element.
◦ Note: By default, the <canvas> element
has no border and no content.
<canvas id="myCanvas" width="200"
height="100"></canvas>
To add a border, use the style
attribute:
16
17. Example..
<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #c3c3c3;">
◦ Your browser does not support the HTML5 canvas tag.
</canvas>
<script>
◦ var c=document.getElementById("myCanvas");
◦ var ctx=c.getContext("2d");
◦ ctx.fillStyle="#FF0000";
◦ ctx.fillRect(0,0,150,75);
</script>
17
Output:
19. SVG
What is SVG?
◦ SVG stands for Scalable Vector Graphics
◦ SVG is used to define vector-based
graphics for the Web
◦ SVG defines the graphics in XML format
◦ SVG graphics do NOT lose any quality if
they are zoomed or resized
◦ Every element and every attribute in SVG
files can be animated
19
20. SVG Advantages:
Advantages of using SVG over other
image formats (like JPEG and GIF) are:
◦ SVG images can be created and edited with
any text editor
◦ SVG images can be
searched, indexed, scripted, and compressed
◦ SVG images are scalable
◦ SVG images can be printed with high quality
at any resolution
◦ SVG images are zoomable (and the image
can be zoomed without degradation)
20
21. SVG Example:
<svg width="300" height="200">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;"
/>
Sorry, your browser does not support inline SVG.
</svg>
21
Output:
22. Differences Between SVG and
Canvas
SVG is a language for describing 2D graphics in XML.
Canvas draws 2D graphics, on the fly (with a
JavaScript).
SVG is XML based, which means that every element is
available within the SVG DOM. You can attach
JavaScript event handlers for an element.
In SVG, each drawn shape is remembered as an
object. If attributes of an SVG object are changed, the
browser can automatically re-render the shape.
Canvas is rendered pixel by pixel. In canvas, once the
graphic is drawn, it is forgotten by the browser. If its
position should be changed, the entire scene needs to
be redrawn, including any objects that might have been
covered by the graphic.
22
23. Drag/Drop
Drag and drop is a very common
feature. It is when you "grab" an object
and drag it to a different location.
Some of browser not support this tag.
23
24. HTML code for Drag/Drop
<script>
function allowDrop(ev)
{
ev.preventDefault();
}
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target
.id);
}
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getEleme
ntById(data));
}
</script>
<div id="div1"
ondrop="drop(event)"
ondragover="allowDrop(even
t)" style="border:solid #000;
height:100px;
width:400px;"></div>
<img id="drag1" src=“img”
draggable="true"
ondragstart="drag(event)"
width="336" height="69">
</body>
24
26. Geo-location
The HTML5 Geolocation is used to get
the geographical position of a user.
There is two methods of Geo-location
◦ Use for coordinates base location
◦ Use for find location on Google maps.
26
27. Coordinate base location :
<p id="demo">Click the button to get your coordinates:</p>
<button onclick="getLocation()">Try It</button>
<script>
var x=document.getElementById("demo");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{x.innerHTML="Geolocation is not supported by this browser.";}
}
function showPosition(position)
{
x.innerHTML="Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
27
28. Geolocation in map
<p id="demo">Click the button to get
your position:</p>
<button onclick="getLocation()">Try
It</button>
<div id="mapholder"></div>
<script>
var
x=document.getElementById("dem
o");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentP
osition(showPosition,showError);
}
else{x.innerHTML="Geolocation is
not supported by this browser.";}
}
function showPosition(position)
{
var
latlon=position.coords.latitud
e+","+position.coords.longitu
de;
var
img_url="http://maps.googlea
pis.com/maps/api/staticmap?
center="
+latlon+"&zoom=14&size=40
0x300&sensor=false";
document.getElementById("
mapholder").innerHTML="<i
mg src='"+img_url+"'>";
}
28
30. Video Tag:
Until now, there has not been a standard for
showing a video/movie on a web page.
Today, most videos are shown through a plug-
in (like flash). However, different browsers may
have different plug-ins.
HTML5 defines a new element which specifies
a standard way to embed a video/movie on a
web page: the <video> element.
30
31. Syntax.
<video width="320" height="240" controls>
<source src="movie.mp4"
type="video/mp4">
Your browser does not support the video
tag.
</video>
• The control attribute adds video
controls, like play, pause, and volume.
31
33. Audio Tag
Until now, there has not been a standard for
playing audio files on a web page.
Today, most audio files are played through a
plug-in (like flash). However, different browsers
may have different plug-ins.
HTML5 defines a new element which specifies a
standard way to embed an audio file on a web
page: the <audio> element.
33
34. Syntax.
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<details>this song is good very good</details>
34
Output
:
35. Track Tag:
Track tag use for where we using more than one video/audio
tag we use in track tag for embedded all audios.
we can also say this container tag.
<track>
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</track>
35
36. Form handling
HTML5 has the following new form elements:
◦ <datalist>
◦ <keygen>
◦ <output>
The <datalist> element specifies a list of pre-defined
options for an <input> element.
The <datalist> element is used to provide an
"autocomplete" feature on <input> elements. Users will
see a drop-down list of pre-defined options as they
input data.
Use the <input> element's list attribute to bind it
together with a <datalist> element.
36
37. Example
An <input> element with pre-defined values in a <datalist>:
<input list="browsers" name="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
This feature works as in www.google.com for searching purpose.
37
Output:
39. Forms and input attributes
39
on
off
Autofocus use for focus
on specific input
<input type=“text”
autofocus ></input>
Autocomplete form and send
to the server
<form
action="demo_form.asp“
autocomplete="on">
Indicates that form will be
not validated on submit
<form
action="demo_form.asp"
novalidate>
Add new input in predefine form
<input form="form_id">
specifies the URL of the file
that will process the input
control when the form is
submitted.
<input formaction="URL"><input type="submit"
formenctype="multipart/for
m-data“>
multipart/form-data=No
characters are encoded
<input formmethod="get|post">
Get=Default. Appends the form-data
to the URL in name pairs:
URL?name=value&name=value
Post=Sends the form-data as an
HTTP post transaction
41. SSE
HTML5 Server-Sent Events allow a web page to
get updates from a server.
Server-Sent Events - One Way Messaging
◦ A server-sent event is when a web page automatically
gets updates from a server.
◦ This was also possible before, but the web page
would have to ask if any updates were available. With
server-sent events, the updates come automatically.
◦ Examples: Facebook/Twitter updates, stock price
updates, news feeds, sport results, etc.
41
43. Introduction:
PHP is a server scripting
language, and is a powerful tool for
making dynamic and interactive Web
pages quickly.
PHP is a widely-used, free, and
efficient alternative to competitors
such as Microsoft's ASP.
A PHP script can be placed anywhere
in the document. 43
44. PHP syntax
A PHP script starts with <?php and
ends with ?>:
<?php
// PHP code goes here
?>
The default file extension for PHP files
is ".php“
44
45. Continued..
A PHP file normally contains HTML
tags, and some PHP scripting code.
Below, we have an example of a simple
PHP file, with a PHP script that uses a
built-in PHP function "echo" to output the
text "Hello World!" on a web page:
<?php
echo "Hello world!";
?>
PHP is an acronym for "PHP Hypertext
Preprocessor"
45
46. Continued..
PHP is a widely-used, open source
scripting language
PHP scripts are executed on the
server
PHP files can contain
text, HTML, CSS, JavaScript, and
PHP code
PHP code are executed on the
server, and the result is returned to the
browser as plain HTML 46
47. What PHP can do?
PHP can generate dynamic page content
PHP can create, open, read, write, 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 restrict users to access some
pages on your website
PHP can encrypt data
47
48. PHP Features.
PHP runs on various platforms
(Windows, Linux, Unix, Mac OS
X, etc.)
PHP is compatible with almost all
servers used today (Apache, IIS, etc.)
PHP supports a wide range of
databases
PHP is free. Download it from the
official PHP resource: www.php.net
PHP is easy to learn and runs 48
49. How to Install PHP?
Install a web server on your own PC
Use a Web Host With PHP Support
If your server has activated support for
PHP you do not need to do anything.
Just create some .php files, place them
in your web directory, and the server will
automatically parse them for you.
You do not need to compile anything or
install any extra tools.
Because PHP is free, most web hosts
offer PHP support.
49
50. Server side Page with PHP
<?php
echo “this is
php output”;
?>
</body>
50
<html>
<head>
</head>
<body>
<h1>this is html
tag</h1>
<h3>next output
is in php
language</h3
>
51. Definition of variables in php
Variables are "containers" for storing
information
<?php
$x=5;
$y=6;
$z=$x+$y;
echo $z;
?>
51
52. Continued..
As with algebra, PHP variables can be
used to hold values (x=5) or
expressions (z=x+y).
A variable can have a short name (like
x and y) or a more descriptive name
(age, carname, total_volume).
52
53. ◦ 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 ($y
and $Y are two different variables)
53
Rules for PHP variables:
54. Creating(Declaring) PHP
Variables:
PHP has no command for declaring a
variable.
A variable is created the moment you first
assign a value to it:
Example
◦ <?php
$txt="Hello world!";
$x=5;
$y=10.5;
?>
54
55. PHP is a Loosely Type
Language
Example
◦ <?php
$txt="Hello world!";
$x=5;
$y=10.5;
?>
In the example above, notice that we did not
have to tell PHP which data type the variable
is.
PHP automatically converts the variable to
the correct data type, depending on its value.
55
56. PHP Variables Scope
In PHP, variables can be declared
anywhere in the script.
The scope of a variable is the part of
the script where the variable can be
referenced/used.
PHP has three different variable
scopes:
◦ local
◦ global
◦ static
56
57. Local and Global Scope
A variable declared outside a function
has a GLOBAL SCOPE and can only
be accessed outside a function.
A variable declared within a function
has a LOCAL SCOPE and can only be
accessed within that function.
57
59. Strings in PHP
A string is a sequence of characters, like "Hello
world!".
The PHP strlen() function
◦ The strlen() function returns the length of a string, in
characters.
◦ The example below returns the length of the string
"Hello world!":
◦ strlen() is often used in loops or other functions, when
it is important to know when a string ends.
Example
◦ <?php
echo strlen("Hello world!");
?>
59
60. PHP strpos() function
◦ The strpos() function is used to search for a
specified character or text within a string.
◦ If a match is found, it will return the character
position of the first match. If no match is
found, it will return FALSE.
◦ The example below searches for the text
"world" in the string "Hello world!":
Example
◦ <?php
echo strpos("Hello world!","world");
?>
60
61. strcmp() Function
The strcmp() function compares two
strings.
◦ Note: The strcmp() function is binary-safe
and case-sensitive.
Example
◦ Compare two strings (case-sensitive):
◦ <?php
echo strcmp("Hello world!","Hello world!");
?>
Syntax:
◦ strcmp(string1,string2)
61
62. Example 2:
<?php
echo strcmp("Hello world!","Hello
world!"); // the two strings are equal
echo strcmp("Hello world!","Hello"); //
string1 is greater than string2
echo strcmp("Hello world!","Hello world!
Hello!"); // string1 is less than string2
?>
62