Advanced
Web Designing
HTML 5 Advanced <input> Elements-
1) <input
type=”color”> -Defines a color
Picker.
2) <input
type=”number”> -Defines a field for entering
a number.
3) <input
type=”url”> -Defines a field for entering a URL
4) <input
type=”image”> -Defines an image as
a submit button
5) <input
type=”date”> -Defines a date picker with the year, month and day
6) <input
type=”email”> -Defines a field
for an e-mail address.
7) <input
type=”month”> -Defines a month and
year control format is “YYYY-MM”
8) <input
type=”range”> -Defines a range
control
9) <input
type=”datetime-local”> -Defines a date
picker that include the year,month,day and time.
10)
<input type=”time”> -Defines a control for entering a time
11)
<input type=”week”> -Defines a week and year control.
12)
<input type=”search”> -Defines a text field for entering search string.
13)
<input type=”file”> -Defines a file select field
14)
<input type=”tel”> -Used to define input field that should contain telephone
number.
Input Restrictions
1) disabled-Specifies
that an input filed should be disabled.
2) max-Specifies
that maximum value for an input filed.
3) Min-specifies
that minimum value for an input filed.
4) Pattern-Specifies
a regular expression to check the input values.
5) Read only –Specifies
that an input field is read only.
6) Placeholder-Specifies
temporary label showing the purpose of text field
7) Required-Specifies
that an input filed is required.
8) Auto
complete-Specifies whether a form or input filed should have auto complete on
or off.
9) Autofocus-Specifies
that the input field should automatically get focus when the page loads.
10)
Height and width- Specifies the height and width of an
<input type=”image”>
11)
Multiple- Specifies that user is allowed to enter more
than one value.
12)
Id- identify the html element uniquely.
13)
Class- used to apply CSS style to the individual input
element.
<meta> Tag
In HTML
<meta> tag describes some aspects of content of a webpage.
<meta>
tag is placed between the <head> and </head> tags.
Metadata
will not be displayed on the webpage.
Attributes
of <meta> tag.
1) Name-
Specifies the name of the meta data.
2) Content-Content
of meta names value.
3) Charset- Specifies
the character encoding used by the document.UTF 8- for Indian characters. Big
5- for Chinese Character.
4) http-equiv-
Used for http response message headers.
Ordered list or Numbered List
<ol>
tag defines an ordered list. An ordered
list can be numerical or alphabetical.
Attributes
of <ol> tag-
1) Type –
Specifies numbering type
Values
1/a/I/i
2) Reversed-Specifies
items of the list are Specified in the revered order.
3) Start- Specifies
the staring number of the first item.
Unordered
or Bulleted List.
An
unordered list created using the <ul> tag ,and each list item starts with
<li> tag.
An
unordered lists are marked with bullets,by default.
Attributes
of <ul> tag.
1) Type- Sets
the list item disc/circle/square
Disc is default
vale of type attribute.
Definition
List-
<dd>
tag used for definition list.
Items
can create in definition list with <dt> and <dd>
<dt>-
define terms
<dd>-
defines terms definition.
Nested
List-
List
within another lsit either order list or unordered list is called nested list.
Audio
in HTML 5
Common
Audio Formats
1) Mp3 from
MPEG(Moving/Motion picture expert group)
2) Aac-Advanced
audio coding,standard format on Iphone,youtube.
3) Ogg-An open
container and free audio format.
<audio> tag-
Attributes
1) Autoplay-
Audio will start playing as soon as it
is ready.
2) Controls-Audio
controls should be displayed (play/pause)
3) Loop- the
audio will start over again, every time it is finished.
4) Muted-specifies
that audio output should be muted
5) Src- Specifies
the URL of audio file
Video in HTML 5
The <video> tag is used to embed video into web
page.
File formats of
video – .mp4,.Ogg and WebM.
Attributes of <video> tag-
Attributes
1) Src- defines
the link to video file
2) Autoplay-
video will start playing as soon as it
is ready.
3) Controls-video
controls should be displayed (play/pause)
4) Loop- the video
will start over again, every time it is finished.
5) Muted-specifies
that video output should be muted
6) Height-sets
the height of the video player.
7) Poster- specifies
an image to be shown while video is downloading or until the user hits the play
button.
8) Preload-
Specifies if and how the author thinks the video shuld be loaded when the webpage
loads.
9) Width-sets
the width of the video player.
No comments:
Post a Comment