Backwards compatible html5 css3 apps in asp net
Download
1 / 15

Backwards Compatible HTML5 - PowerPoint PPT Presentation


  • 91 Views
  • Uploaded on

Backwards Compatible HTML5/CSS3 Apps in ASP.NET . Nik Kalyani, Founder/CEO, HyperCrunch, Inc. m y hometown. m e. m y company. Nik Kalyani. CALIFORNIA. 1994. 1996. 1998. 2000. 2002. 2004. 2006. 2008. 2010. 2012. stuff I did. Sold. Co-founded.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Backwards Compatible HTML5' - kenley


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Backwards compatible html5 css3 apps in asp net
Backwards Compatible HTML5/CSS3 Apps in ASP.NET

Nik Kalyani, Founder/CEO, HyperCrunch, Inc.


my hometown

me

my company

Nik

Kalyani

CALIFORNIA

1994

1996

1998

2000

2002

2004

2006

2008

2010

2012

stuff I did

Sold

Co-founded

Definiti, Inc.(Technology Services)

Folded

Founded

iWidgets, Inc.(Venture Funded DotCom)

Co-founded

DotNetNuke Corp.(Venture Funded O/S CMS)

Founded

HyperCrunch, Inc.(Stealth Mode)

Award Recognition:Microsoft MVP ASP.NET

1994

1996

1998

2000

2002

2004

2006

2008

2010

2012


Agenda
Agenda

Highlights: HTML5 and CSS3

Code

Q and A



Overview
Overview

HTML 5

  • Specifically designed for web applications

  • Nice to search engines and screen readers

  • HTML 5 will update HTML 4.01, DOM Level 2

CSS level 3

  • Will make it easier to do complex designs

  • Will look the same across all browsers

  • CSS 3 will update CSS level 2 (CSS 2.1)


Html5 new doctype
HTML5: New DocType

<!DOCTYPE html>

Works now in all browsers for “standards mode” start using it!


Structural elements
Structural Elements

<header>

<nav>

<article>

<aside>

<section>

<footer>

<summary>

<details>


Html5 audio video
HTML5: Audio & Video

Native Audio Element

<audio>

<source src="music.oga" type="audio/ogg">

<source src="music.mp3" type="audio/mpeg">

</audio>

Native Video Element

<video src="video.ogv" controls poster="poster.jpg">

<a href="video.ogv">Download movie</a>

</video>


Html5 canvas 2d drawing
HTML5: Canvas- 2D Drawing

function draw() {

varctx = document.getElementById('canvas').getContext('2d');

varimg = new Image();

img.onload = function(){

ctx.drawImage(img,0,0);

ctx.beginPath();

ctx.moveTo(30,96);

ctx.lineTo(70,66);

ctx.lineTo(103,76);

ctx.lineTo(170,15);

ctx.stroke();

}

img.src = 'images/backdrop.png';

}


Html5 form elements
HTML5: Form Elements

  • New Input Types

    tel, search, url, email,

    datetime, date, month, week, time, datetime-local,

    number, range, color

  • New Elements

    <datalist>

    <meter>

    <progress>

    <output>


Html5 dom apis
HTML5: DOM APIs

Geo-location

Structured Client-side Storage

Cross-document Messaging

Drag and Drop


CSS3

  • Attributes

    opacity, rgb, hsla

    background-size, background-image

    border-color, border-image, border-radius, box-shadow

    text-overflow, text-shadow, column-width, column-gap


Code download http www kalyani com
CodeDownload: http://www.kalyani.com


Resources
Resources

http://html5doctor.com/

http://www.html5test.com/

My Blog: http://www.kalyani.com


ad