SlideShare une entreprise Scribd logo
1  sur  13
Télécharger pour lire hors ligne
Usage of meta tag
       iOS
Text content of body in html page
without meta tag
"Hello world!" is displayed like
this when we're not using meta
tag.
Text content of body with meta tag
Text displayed normally when
using meta tag
Meta tag customization
        Android
Same HTML page in Android
emulator (without meta tag)
If no meta tag is used, HTML
page will look like this.
using "width = device-width" in
content
device-width: Measures width
in device pixels

width : Measures width in
CSS pixels

Zooming in web page affects
CSS pixels, not device pixels.
Removed width from content
Removed width from content
user-scalable = yes
By setting user-scalable
to yes
user-scalable = no
By setting user-scalable
to no
Different values of target-densitydpi
target-densitydpi varies
from 70-400
240   320   360
Maximum target-densitydpi is 400




Below 70 & Above 400 will look like this
using "low-dpi" in   using "medium-dpi" in   using "high-dpi" in
target-densitydpi      target-densitydpi      target-densitydpi

Contenu connexe

Similaire à Meta tag customization (iOS + android)

How to Develop Responsive Websites - Website Development
How to Develop Responsive Websites - Website DevelopmentHow to Develop Responsive Websites - Website Development
How to Develop Responsive Websites - Website DevelopmentMukesoft - IT Consultants
 
CSS3 Media Queries
CSS3 Media QueriesCSS3 Media Queries
CSS3 Media QueriesRuss Weakley
 
Organize Your Website With Advanced CSS Tricks
Organize Your Website With Advanced CSS TricksOrganize Your Website With Advanced CSS Tricks
Organize Your Website With Advanced CSS TricksAndolasoft Inc
 
Media queries A to Z
Media queries A to ZMedia queries A to Z
Media queries A to ZShameem Reza
 
Idiot's Guide to viewport and pixel
Idiot's Guide to viewport and pixelIdiot's Guide to viewport and pixel
Idiot's Guide to viewport and pixelNathan Campos
 
[Tutorial] flexible designs for the gear
[Tutorial] flexible designs for the gear[Tutorial] flexible designs for the gear
[Tutorial] flexible designs for the gearRyo Jin
 
Responsive Web Designs
Responsive Web DesignsResponsive Web Designs
Responsive Web DesignsNusrat Khanom
 
Margin vs Padding.pdf
Margin vs Padding.pdfMargin vs Padding.pdf
Margin vs Padding.pdfWebMaxy
 
Intro to @viewport & other new Responsive Web Design CSS features
Intro to @viewport & other new Responsive Web Design CSS featuresIntro to @viewport & other new Responsive Web Design CSS features
Intro to @viewport & other new Responsive Web Design CSS featuresAndreas Bovens
 
INTEGRATION (HTML/CSS) The technology behind AESTHETICS
INTEGRATION (HTML/CSS) The technology behind AESTHETICSINTEGRATION (HTML/CSS) The technology behind AESTHETICS
INTEGRATION (HTML/CSS) The technology behind AESTHETICSSiddharth Lale
 
Introduction to Responsive Web Design
Introduction to Responsive Web DesignIntroduction to Responsive Web Design
Introduction to Responsive Web DesignShawn Calvert
 
GDI Seattle Intermediate HTML and CSS Class 1
GDI Seattle Intermediate HTML and CSS Class 1GDI Seattle Intermediate HTML and CSS Class 1
GDI Seattle Intermediate HTML and CSS Class 1Heather Rock
 
CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience Hitesh Kumar
 
CSS Foundations, pt 2
CSS Foundations, pt 2CSS Foundations, pt 2
CSS Foundations, pt 2Shawn Calvert
 

Similaire à Meta tag customization (iOS + android) (20)

How to Develop Responsive Websites - Website Development
How to Develop Responsive Websites - Website DevelopmentHow to Develop Responsive Websites - Website Development
How to Develop Responsive Websites - Website Development
 
CSS3 Media Queries
CSS3 Media QueriesCSS3 Media Queries
CSS3 Media Queries
 
Organize Your Website With Advanced CSS Tricks
Organize Your Website With Advanced CSS TricksOrganize Your Website With Advanced CSS Tricks
Organize Your Website With Advanced CSS Tricks
 
Media queries A to Z
Media queries A to ZMedia queries A to Z
Media queries A to Z
 
Responsive design
Responsive designResponsive design
Responsive design
 
Idiot's Guide to viewport and pixel
Idiot's Guide to viewport and pixelIdiot's Guide to viewport and pixel
Idiot's Guide to viewport and pixel
 
[Tutorial] flexible designs for the gear
[Tutorial] flexible designs for the gear[Tutorial] flexible designs for the gear
[Tutorial] flexible designs for the gear
 
Lab#13 responsive web
Lab#13 responsive webLab#13 responsive web
Lab#13 responsive web
 
Aaug sample slides
Aaug sample slidesAaug sample slides
Aaug sample slides
 
Responsive Web Designs
Responsive Web DesignsResponsive Web Designs
Responsive Web Designs
 
Margin vs Padding.pdf
Margin vs Padding.pdfMargin vs Padding.pdf
Margin vs Padding.pdf
 
Intro to @viewport & other new Responsive Web Design CSS features
Intro to @viewport & other new Responsive Web Design CSS featuresIntro to @viewport & other new Responsive Web Design CSS features
Intro to @viewport & other new Responsive Web Design CSS features
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
INTEGRATION (HTML/CSS) The technology behind AESTHETICS
INTEGRATION (HTML/CSS) The technology behind AESTHETICSINTEGRATION (HTML/CSS) The technology behind AESTHETICS
INTEGRATION (HTML/CSS) The technology behind AESTHETICS
 
CSS.pptx
CSS.pptxCSS.pptx
CSS.pptx
 
Introduction to Responsive Web Design
Introduction to Responsive Web DesignIntroduction to Responsive Web Design
Introduction to Responsive Web Design
 
GDI Seattle Intermediate HTML and CSS Class 1
GDI Seattle Intermediate HTML and CSS Class 1GDI Seattle Intermediate HTML and CSS Class 1
GDI Seattle Intermediate HTML and CSS Class 1
 
CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience
 
New
NewNew
New
 
CSS Foundations, pt 2
CSS Foundations, pt 2CSS Foundations, pt 2
CSS Foundations, pt 2
 

Meta tag customization (iOS + android)