PHP: Date Pretty Difference

This function will return a pretty date difference Requires PHP 5.2.0 or higher

/**
* @param   string date
* @param   string date
* @return  string
*/

function prettyDateDiff ( $date_started , $date_ended ) {
return DateTime :: createFromFormat ( 'Y-m-d H:i:s' , $date_started ) -> diff ( DateTime :: createFromFormat ( 'Y-m-d H:i:s' , $date_ended ) ) -> format ( '%a days %H hours %i minutes' ) ;
}

Example Usage:

echo prettyDateDiff ( '2013-10-08 09:12:00' , '2013-10-15 10:43:00' ) ;

Returns: 7 days 01 hours 31 minutes

If you have any questions, make sure to add it to the comments below.

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - November 28, 2013 at 12:07 am

Categories: Uncategorized Tags:

How to backup your MySql database to Dropbox using CodeIgniter PHP Framework

Last week I had a big problem with the System I have maintain for a couple of months now. Basically the system works like a storage of reports, so it uses Mysql Database to store and retrieve its data. The system also has this emailing functionality which sends a bunch of emails to an invited persons for its campaign every day with at least a couple of hundred emails sent. Then all of the sudden the system went offline and in the following hour I received an email from my hosting company stating that my hosting account was cancelled/terminated because I was violating their rules spam, bread and egg blah blah blah.

So basically what I would want in that very moment is to move the system to a new hosting or temporary live host so that we can still use the system. BUT! the problem then was I unable to access the host files and databases because my account was suspended, so I need to create support ticket to the hosting company requesting a temporary access to my files for backup. It took me almost 4 days to re-up the system into a new host from the backup files and data I grabbed from my hosting company from a long ticketing system wait.  WHAT I DIDN’T AND SHOULD HAVE DONE in the first place as a system developer was to create a functionality for the system to create a backup copy of the files and its database in a separate location.

Just recently I added “The backup functionality” for the system. A free storage from Dropbox and Brilliant API Library for PHP CodeIgniter solves my future problem. This library has this sample Controller implementing its uses.

To use this library you need to create a dropbox application here and get the ‘App Key’ and ‘App Secret’. After you create you archiving routine of your files and database, you can then proceed to the API use. The library’s sample controller has all you need to run your saving of your files.

The request_dropbox() function should be the first function to be executed, you need to provide you Dropbox application app key and app secret. This function will initiate the the hand-shake between the user’s dropbox account and your dropbox application. Your dropbox application will ask the user to allow the application to control (create folder, save files, etc) the users dropbox account.

Here’s the snippet of request_dropbox function

$params [ 'key' ] = 'YOUR DROPBOX CONSUMER KEY' ;
$params [ 'secret' ] = 'YOUR DROPBOX CONSUMER SECRET' ;

$this -> load -> library ( 'dropbox' , $params ) ;
$data = $this -> dropbox -> get_request_token ( site_url ( "example/access_dropbox" ) ) ;
$this -> session -> set_userdata ( 'token_secret' , $data [ 'token_secret' ] ) ;
redirect ( $data [ 'redirect' ] ) ;

Here’s the test function

public function test_dropbox ( ) {
$params [ 'key' ] = 'YOUR DROPBOX CONSUMER KEY' ;
$params [ 'secret' ] = 'YOUR DROPBOX CONSUMER SECRET' ;
$params [ 'access' ] = array ( 'oauth_token' => urlencode ( $this -> session -> userdata ( 'oauth_token' ) ) ,
'oauth_token_secret' => urlencode ( $this -> session -> userdata ( 'oauth_token_secret' ) ) ) ;

$this -> load -> library ( 'dropbox' , $
$dbobj = $this -> dropbox -> account ( ) ;
print_r ( $dbobj ) ;
}

to see more if its functionality you can freely read its Class here

I maybe not clear enough explaining how to implement this library BUT THIS WILL: THE READ ME . I hope you find this article helpful and prevent what I went through.

Leave a comment below if you need more clarification. I’d be glad to help.

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - June 15, 2012 at 9:17 pm

Categories: PHP Tags: , , , , , , , , , , , , , , ,

How To Create Live Date/Time (Clock) Display Using jQuery

A while ago I’ve added a live clock to the website which I’m currently developing, and I find it pretty nice on the right top most header portion of the site. I think maybe someone out may want to try it out.

Dependency: jQuery


Below script is my live clock function that will display date time formatted month/day/year hour:minutes:seconds. For now I will just leave this code here, beacuase ahmm too lazy to explain things :P

< script type = "text/javascript" >
var liveClock = function ( servertime ) {
var currDateTime = servertime ;
var addLeadingZero = function ( s ) {
return ( s < 10 ) ? ( '0' + s ) : s ;
} ;
var formattedDate = function ( date ) {
var h = date. getHours ( ) , hour = ( h < 1 ) ? ( h + 1 ) : ( ( h > 12 ) ? ( h - 12 ) : h ) , a = ( h < 12 ) ? 'am' : 'pm' ;
return ( date. getMonth ( ) + 1 ) + '/' + date. getDate ( ) + '/' + date. getFullYear ( ) + ' ' + hour + ':' + addLeadingZero ( date. getMinutes ( ) ) + ':' + addLeadingZero ( date. getSeconds ( ) ) + a ;
} ;
var setDateTime = function ( ) {
currDateTime. setSeconds ( currDateTime. getSeconds ( ) + 1 ) ;
$ ( '#server-time' ) . html ( formattedDate ( currDateTime ) ) ;
return false ;
} ;
var everySec = setInterval ( setDateTime , 1000 ) ;
} ;
liveClock ( server_time ) ;
</ script >

note: #server-time is the id of that html element where you want to display the clock, and oh don’t forget to include jquery :D . thanks! let me know what you think!

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - May 1, 2012 at 5:41 am

Categories: Uncategorized Tags:

How to Decompress .tar.bz2

tar -xjvf example.tar.bz2

Tar Paramenters are:

Usage: tar [OPTION…] [FILE]…
GNU `tar’ saves many files together into a single tape or disk archive, and can
restore individual files from the archive.

Examples:
tar -cf archive.tar foo bar # Create archive.tar from files foo and bar.
tar -tvf archive.tar # List all files in archive.tar verbosely.
tar -xf archive.tar # Extract all files from archive.tar.

Main operation mode:

-A, –catenate, –concatenate append tar files to an archive
-c, –create create a new archive
-d, –diff, –compare find differences between archive and file system
–delete delete from the archive (not on mag tapes!)
-r, –append append files to the end of an archive
-t, –list list the contents of an archive
–test-label test the archive volume label and exit
-u, –update only append files newer than copy in archive
-x, –extract, –get extract files from an archive

Operation modifiers:

–check-device check device numbers when creating incremental
archives (default)
-g, –listed-incremental=FILE handle new GNU-format incremental backup
-G, –incremental handle old GNU-format incremental backup
–ignore-failed-read do not exit with nonzero on unreadable files
–level=NUMBER dump level for created listed-incremental archive
-n, –seek archive is seekable
–no-check-device do not check device numbers when creating
incremental archives
–no-seek archive is not seekable
–occurrence[=NUMBER] process only the NUMBERth occurrence of each file
in the archive; this option is valid only in
conjunction with one of the subcommands –delete,
–diff, –extract or –list and when a list of
files is given either on the command line or via
the -T option; NUMBER defaults to 1
–sparse-version=MAJOR[.MINOR]
set version of the sparse format to use (implies
–sparse)
-S, –sparse handle sparse files efficiently

Overwrite control:

-k, –keep-old-files don’t replace existing files when extracting
–keep-newer-files don’t replace existing files that are newer than
their archive copies
–no-overwrite-dir preserve metadata of existing directories
–overwrite overwrite existing files when extracting
–overwrite-dir overwrite metadata of existing directories when
extracting (default)
–recursive-unlink empty hierarchies prior to extracting directory
–remove-files remove files after adding them to the archive
-U, –unlink-first remove each file prior to extracting over it
-W, –verify attempt to verify the archive after writing it

Select output stream:

–ignore-command-error ignore exit codes of children
–no-ignore-command-error treat non-zero exit codes of children as
error
-O, –to-stdout extract files to standard output
–to-command=COMMAND pipe extracted files to another program

Handling of file attributes:

–acls Save the ACLs to the archive
–atime-preserve[=METHOD] preserve access times on dumped files, either
by restoring the times after reading
(METHOD=’replace'; default) or by not setting the
times in the first place (METHOD=’system’)
–delay-directory-restore delay setting modification times and
permissions of extracted directories until the end
of extraction
–group=NAME force NAME as group for added files
–mode=CHANGES force (symbolic) mode CHANGES for added files
–mtime=DATE-OR-FILE set mtime for added files from DATE-OR-FILE
-m, –touch don’t extract file modified time
–no-acls Don’t extract the ACLs from the archive
–no-delay-directory-restore
cancel the effect of –delay-directory-restore
option
–no-same-owner extract files as yourself (default for ordinary
users)
–no-same-permissions apply the user’s umask when extracting permissions
from the archive (default for ordinary users)
–no-selinux Don’t extract the SELinux context from the archive

–no-xattrs Don’t extract the user/root xattrs from the
archive
–numeric-owner always use numbers for user/group names
–owner=NAME force NAME as owner for added files
-p, –preserve-permissions, –same-permissions
extract information about file permissions
(default for superuser)
–preserve same as both -p and -s
–same-owner try extracting files with the same ownership as
exists in the archive (default for superuser)
-s, –preserve-order, –same-order
sort names to extract to match archive
–selinux Save the SELinux context to the archive
–xattrs Save the user/root xattrs to the archive

Device selection and switching:

-f, –file=ARCHIVE use archive file or device ARCHIVE
–force-local archive file is local even if it has a colon
-F, –info-script=NAME, –new-volume-script=NAME
run script at end of each tape (implies -M)
-L, –tape-length=NUMBER change tape after writing NUMBER x 1024 bytes
-M, –multi-volume create/list/extract multi-volume archive
–rmt-command=COMMAND use given rmt COMMAND instead of rmt
–rsh-command=COMMAND use remote COMMAND instead of rsh
–volno-file=FILE use/update the volume number in FILE

Device blocking:

-b, –blocking-factor=BLOCKS BLOCKS x 512 bytes per record
-B, –read-full-records reblock as we read (for 4.2BSD pipes)
-i, –ignore-zeros ignore zeroed blocks in archive (means EOF)
–record-size=NUMBER NUMBER of bytes per record, multiple of 512

Archive format selection:

-H, –format=FORMAT create archive of the given format

FORMAT is one of the following:

gnu GNU tar 1.13.x format
oldgnu GNU format as per tar <= 1.12
pax POSIX 1003.1-2001 (pax) format
posix same as pax
ustar POSIX 1003.1-1988 (ustar) format
v7 old V7 tar format

–old-archive, –portability
same as –format=v7
–pax-option=keyword[[:]=value][,keyword[[:]=value]]…
control pax keywords
–posix same as –format=posix
-V, –label=TEXT create archive with volume name TEXT; at
list/extract time, use TEXT as a globbing pattern
for volume name

Compression options:

-a, –auto-compress use archive suffix to determine the compression
program
-I, –use-compress-program=PROG
filter through PROG (must accept -d)
-j, –bzip2 filter the archive through bzip2
-J, –xz filter the archive through xz
–lzip filter the archive through lzip
–lzma filter the archive through lzma
–lzop
–no-auto-compress do not use archive suffix to determine the
compression program
-z, –gzip, –gunzip, –ungzip filter the archive through gzip
-Z, –compress, –uncompress filter the archive through compress

Local file selection:

–add-file=FILE add given FILE to the archive (useful if its name
starts with a dash)
–backup[=CONTROL] backup before removal, choose version CONTROL
-C, –directory=DIR change to directory DIR
–exclude=PATTERN exclude files, given as a PATTERN
–exclude-backups exclude backup and lock files
–exclude-caches exclude contents of directories containing
CACHEDIR.TAG, except for the tag file itself
–exclude-caches-all exclude directories containing CACHEDIR.TAG
–exclude-caches-under exclude everything under directories containing
CACHEDIR.TAG
–exclude-tag=FILE exclude contents of directories containing FILE,
except for FILE itself
–exclude-tag-all=FILE exclude directories containing FILE
–exclude-tag-under=FILE exclude everything under directories
containing FILE
–exclude-vcs exclude version control system directories
-h, –dereference follow symlinks; archive and dump the files they
point to
–hard-dereference follow hard links; archive and dump the files they
refer to
-K, –starting-file=MEMBER-NAME
begin at member MEMBER-NAME in the archive
–newer-mtime=DATE compare date and time when data changed only
–no-null disable the effect of the previous –null option
–no-recursion avoid descending automatically in directories
–no-unquote do not unquote filenames read with -T
–null -T reads null-terminated names, disable -C
-N, –newer=DATE-OR-FILE, –after-date=DATE-OR-FILE
only store files newer than DATE-OR-FILE
–one-file-system stay in local file system when creating archive
-P, –absolute-names don’t strip leading `/’s from file names
–recursion recurse into directories (default)
–suffix=STRING backup before removal, override usual suffix (‘~’
unless overridden by environment variable
SIMPLE_BACKUP_SUFFIX)
-T, –files-from=FILE get names to extract or create from FILE
–unquote unquote filenames read with -T (default)
-X, –exclude-from=FILE exclude patterns listed in FILE

File name transformations:

–strip-components=NUMBER strip NUMBER leading components from file
names on extraction
–transform=EXPRESSION, –xform=EXPRESSION
use sed replace EXPRESSION to transform file
names

File name matching options (affect both exclude and include patterns):

–anchored patterns match file name start
–ignore-case ignore case
–no-anchored patterns match after any `/’ (default for
exclusion)
–no-ignore-case case sensitive matching (default)
–no-wildcards verbatim string matching
–no-wildcards-match-slash wildcards do not match `/’
–wildcards use wildcards (default)
–wildcards-match-slash wildcards match `/’ (default for exclusion)

Informative output:

–checkpoint[=NUMBER] display progress messages every NUMBERth record
(default 10)
–checkpoint-action=ACTION execute ACTION on each checkpoint
–index-file=FILE send verbose output to FILE
-l, –check-links print a message if not all links are dumped
–no-quote-chars=STRING disable quoting for characters from STRING
–quote-chars=STRING additionally quote characters from STRING
–quoting-style=STYLE set name quoting style; see below for valid STYLE
values
-R, –block-number show block number within archive with each
message
–show-defaults show tar defaults
–show-omitted-dirs when listing or extracting, list each directory
that does not match search criteria
–show-transformed-names, –show-stored-names
show file or archive names after transformation
–totals[=SIGNAL] print total bytes after processing the archive;
with an argument – print total bytes when this
SIGNAL is delivered; Allowed signals are: SIGHUP,
SIGQUIT, SIGINT, SIGUSR1 and SIGUSR2; the names
without SIG prefix are also accepted
–utc print file modification dates in UTC
-v, –verbose verbosely list files processed
–warning=KEYWORD warning control
-w, –interactive, –confirmation
ask for confirmation for every action

Compatibility options:

-o when creating, same as –old-archive; when
extracting, same as –no-same-owner

Other options:

-?, –help give this help list
–restrict disable use of some potentially harmful options
–usage give a short usage message
–version print program version

Mandatory or optional arguments to long options are also mandatory or optional
for any corresponding short options.

The backup suffix is `~’, unless set with –suffix or SIMPLE_BACKUP_SUFFIX.
The version control may be set with –backup or VERSION_CONTROL, values are:

none, off never make backups
t, numbered make numbered backups
nil, existing numbered if numbered backups exist, simple otherwise
never, simple always make simple backups

Valid arguments for the –quoting-style option are:

literal
shell
shell-always
c
c-maybe
escape
locale
clocale

*This* tar defaults to:
–format=gnu -f- -b20 –quoting-style=escape –rmt-command=/sbin/rmt
–rsh-command=/usr/bin/rsh

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - February 3, 2012 at 12:29 pm

Categories: Uncategorized Tags:

How to Display Customized Date and Time in Javascript

Step 1: Create a Javascript Date instance.
When creating a date instance, its as simple as the code below: this will create the current user’s computer Date and Time.

var mydate = new Date ( ) ;

Step 2: Displaying the default date format.
The code above will assign date function to the variable mydate . Let us now see the mydate variable looks like if displayed.

< html >
< head >
< script type = "text/javacript" >

var mydate = new Date ( ) ;

document. getElementById ( "mydate_container" ) . innerHTML = mydate ;

</ script >
< head >
< body >
< div id = "mydate_container" ></ div >
</ body >
</ html >

The result would be:


Step 3: Customizing Date to display.
Now let us try to rearrange the date to whatever positioning we want.

< html >
< head >
< script type = "text/javacript" >

var mydate = new Date ( ) ;
var year = mydate. getFullYear ( ) ;
var month = mydate. getMonth ( ) ;
var day = mydate. getDay ( ) ;
var hours = mydate. getHours ( ) ;
var minutes mydate. getMinutes ( ) ;

var myFormattedDate = month + '/' + date + '/' + year + ' ' + hours + ':' + minutes ;

document. getElementById ( "mydate_container" ) . innerHTML = myFormattedDate ;

</ script >
< head >
< body >
< div id = "mydate_container" ></ div >
</ body >
</ html >

The result:


That’s it! really simple eh?

Here’s the list of the rest of the Javascript Date method.

Method

Description

getDate() Returns the day of the month (from 1-31)
getDay() Returns the day of the week (from 0-6)
getFullYear() Returns the year (four digits)
getHours() Returns the hour (from 0-23)
getMilliseconds() Returns the milliseconds (from 0-999)
getMinutes() Returns the minutes (from 0-59)
getMonth() Returns the month (from 0-11)
getSeconds() Returns the seconds (from 0-59)
getTime() Returns the number of milliseconds since midnight Jan 1, 1970
getTimezoneOffset() Returns the time difference between GMT and local time, in minutes
getUTCDate() Returns the day of the month, according to universal time (from 1-31)
getUTCDay() Returns the day of the week, according to universal time (from 0-6)
getUTCFullYear() Returns the year, according to universal time (four digits)
getUTCHours() Returns the hour, according to universal time (from 0-23)
getUTCMilliseconds() Returns the milliseconds, according to universal time (from 0-999)
getUTCMinutes() Returns the minutes, according to universal time (from 0-59)
getUTCMonth() Returns the month, according to universal time (from 0-11)
getUTCSeconds() Returns the seconds, according to universal time (from 0-59)
parse() Parses a date string and returns the number of milliseconds since midnight of January 1, 1970
setDate() Sets the day of the month (from 1-31)
setFullYear() Sets the year (four digits)
setHours() Sets the hour (from 0-23)
setMilliseconds() Sets the milliseconds (from 0-999)
setMinutes() Set the minutes (from 0-59)
s etMonth() Sets the month (from 0-11)
setSeconds() Sets the seconds (from 0-59)
setTimSe() Sets a date and time by adding or subtracting a specified number of milliseconds to/from midnight January 1, 1970
setUTCDate() Sets the day of the month, according to universal time (from 1-31)
setUTCFullYear() Sets the year, according to universal time (four digits)
setUTCHours() Sets the hour, according to universal time (from 0-23)
setUTCMilliseconds() Sets the milliseconds, according to universal time (from 0-999)
setUTCMinutes() Set the minutes, according to universal time (from 0-59)
setUTCMonth() Sets the month, according to universal time (from 0-11)
setUTCSeconds() Set the seconds, according to universal time (from 0-59)
setYear() Deprecated. Use the setFullYear() method instead
toDateString() Converts the date portion of a Date object into a readable string
toGMTString() Deprecated. Use the toUTCString() method instead
toLocaleDateString() Returns the date portion of a Date object as a string, using locale conventions
toLocaleTimeString() Returns the time portion of a Date object as a string, using locale conventions
toLocaleString() Converts a Date object to a string, using locale conventions
toString() Converts a Date object to a string
toTimeString() Converts the time portion of a Date object to a string
toUTCString() Converts a Date object to a string, according to universal time
UTC() Returns the number of milliseconds in a date string since midnight of January 1, 1970, according to universal time
valueOf() Returns the primitive value of a Date object

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - January 19, 2012 at 11:23 am

Categories: Javascript Tags: , ,

How to Scripting HTML

What is HTML?

HTML is a set of tags that has several rules when using them in making what they call a hypertext document. HTML stands for Hypertext Markup Language, it is the greatest scripting language in for web pages. HTML provides a means of creating structured documents by indicating structural semantics for text such as paragraphs, list, heading etc as well as for hyperlinks, quotes, images or other items.

HTML Tags

The HTML markup tags. They are often called HTML tags. HTML tag is a work that is surrounded by <html> angle brackets. HTML tag almost come in pairs except for some keyword that comes opening and closing within the same tag for example below.

< strong > I am a bold text < / strong >

HTML tags are usually paired the first tag is the <b> and the second tag or the closing tag is the </b> take note of the font slash / the closing tag must always have the front slash right before the keyword.

HTML Document or The Web Pages

HTML documents are described as web pages, they contain HTML tags and plain text. Most often they are called Website pages. HTML document can be viewed by a program or software called web browsers e.g Firefox by Mozilla, Internet Explorer by Microsoft, Google Chrome by Google and many more.

< html >
< >

< h1 > This is the Heading < / h1 >

< p > While I am the paragraph. < / p >

< / >
< / html >

The HTML code above <html> and </html> is the main code for the whole HTML document, it open the whole HTML code at <html> and it will end at </html> . The body tag which is <body> and </body> is the part of HTML that is visible in the web browsers. The <h1> and </h1> tags are the Heading tags, they are mostly used in title of an article or page. The <p> and </p> are the paragraph tags, everything between those <p> codes are displayed as a paragraph style.

How can you create an HTML document?

HTML document can be created or edited using many kind of editors like Dreamweaver or Visual Studio, Notepad++ for better code highlighting so you can the tags in different colors and easily spot the start and end of each of the tags you used. But for starters you can use Windows Notepad or

Create your first Test Page

Copy the copy below and named it whatever you want BUT you must use .htm or .html as file extension of that document. To create a .html file in Notepad Click ‘File’ then ‘Save’ and make sure that the ‘Save as type’ is valued ‘All files (*.*)’ and then you can go ahead and name your files for example myhtml.html and hit save.

< html >

< >

< h1 > Hello World! < / h1 >

< p > This is my first created HTML document. < / p >

< / >

< / html

After you have copied the code above and save it in a file name of your choice with a .html or .htm extension, locate the file and double click on it and you will see you first created Web Page opened in your browser.

Creating HTML heading

We used a heading tag in your first created Web page so you are now familiar with heading tags, there are 6 kinds of heading tags <h1> to <h6> greater the number the smaller the size of text. Example below

Code:

< html >

< >

< h1 > I am the H1 < / h1 >

< h2 > I am the H2 < / h2 >

< h3 > I am the H3 < / h3 >

< h4 > I am the H4 < / h4 >

< h5 > I am the H5 < / h5 >

< h6 > I am the H6 < / h6 >

< / >

< / html >

Result:

I am the H1

I am the H2

I am the H3

I am the H4

I am the H5
I am the H6

though h4 to h6 tags looks kinda the same by they are different.

Creating HTML Paragraph

You are also familiar now with this <p> tag as we have example this in your first Web Page.

< p > I am simply a Paragraph. < / p >

Creating HTML Link

What we have not discuss is the HTML link. The HTML Link is created using the <a> and </a> tag, if you are wondering what ‘a’ stands for its anchor or anchor text.

Code:

< a href = ”http: // www.google.com”> My Link to Google.com website < / a >

Result:
My Link to Google.com website

Creating HTML Images

One of the cool stuff that HTML can do is it can embed images on to your web document. HTML images are defined with the <img> tag.

Example Code:

< img src = ”howtoscripting.jpg” width = 104 height = 142 / >

Result:

Image from <img> tag

Image from <img> tag

The HTML Elements

The individual components of an HTML document are what we call the HTML Elements, were each of the elements can have their own attribute specified. The HTML elements represents semantics, or meaning e.g title element represents the title of the web page or the document.

The Complete List of HTML 4 Elements

Name Description
A anchor
ABBR abbreviated form (e.g., WWW, HTTP, etc.)
ACRONYM
ADDRESS information on author
APPLET Java applet
AREA client-side image map area
B bold text style
BASE document base URI
BASEFONT base font size
BDO I18N BiDi over-ride
BIG large text style
BLOCKQUOTE long quotation
BODY document body
BR forced line break
BUTTON push button
CAPTION table caption
CENTER shorthand for DIV align=center
CITE citation
CODE computer code fragment
COL table column
COLGROUP table column group
DD definition description
DEL deleted text
DFN instance definition
DIR directory list
DIV generic language/style container
DL definition list
DT definition term
EM emphasis
FIELDSET form control group
FONT local change to font
FORM interactive form
FRAME subwindow
FRAMESET window subdivision
H1 heading
H2 heading
H3 heading
H4 heading
H5 heading
H6 heading
HEAD document head
HR horizontal rule
HTML document root element
I italic text style
IFRAME inline subwindow
IMG Embedded image
INPUT form control
INS inserted text
ISINDEX single line prompt
KBD text to be entered by the user
LABEL form field label text
LEGEND fieldset legend
LI list item
LINK a media-independent link
MAP client-side image map
MENU menu list
META generic metainformation
NOFRAMES alternate content container for non frame-based rendering
NOSCRIPT alternate content container for non script-based rendering
OBJECT generic embedded object
OL ordered list
OPTGROUP option group
OPTION selectable choice
P paragraph
PARAM named property value
PRE preformatted text
Q short inline quotation
S strike-through text style
SAMP sample program output, scripts, etc.
SCRIPT script statements
SELECT option selector
SMALL small text style
SPAN generic language/style container
STRIKE strike-through text
STRONG strong emphasis
STYLE style info
SUB subscript
SUP superscript
TABLE
TBODY table body
TD table data cell
TEXTAREA multi-line text field
TFOOT table footer
TH table header cell
THEAD table header
TITLE document title
TR table row
TT teletype or monospaced text style
U underlined text style
UL unordered list
VAR instance of a variable or program argument

HTML Element Syntax

As I mentioned above almost all the elements of the HTML have starting and ending tag. For example <html> and </html> so the content of HTML elements is found between those tags. But there are some elements that do not have content e.g <br /> the starting and the closing tag of this element are combined into one tag. Most HTML elements can have its own attributes.

P.S

More on this topic later as I will be updating this page until all the HTML basics are discussed.

Be the first to comment - What do you think?
Posted by Mark Anthony Sabandal - March 8, 2011 at 5:19 pm

Categories: HTML Tags: , , , , , , , , , , , , , , , , , , ,