HTML and CSS Reference
In-Depth Information
Listing 4-1.
Basic HTML Mobile Web Page
<!DOCTYPE html>
<html lang="en-GB" dir="ltr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0;
maximum-scale=1.0; user-scalable=0; target-densitydpi=device-dpi;"/>
<title>Standard Paging</title>
</head>
<body>
</body>
</html>
There is nothing special here, as explained in Chapter 1 we set the
charset
and
viewport
meta tags to ensure that the page scales accordingly and to prevent
the user from zooming in with their fingers. We also set the page title for good
measure. Within the body of
index.html
, create a link and header, as shown in
Listing 4-2.
Listing 4-2.
Creating a Link in index.html
<h1>Page 1</h1>
<a href="./index2.html">Page 2</a>
In
index2.html
, create another link in the body linking back to the previous
page, as shown in Listing 4-3.
Listing 4-3.
Creating a Link Back to index.html in index2.html
<h1>Page 2</h1>
<a href="./index.html">Page 1</a>
Load it up in your mobile browser and test it out. It's as simple as that. There's
nothing special about creating links to other standard HTML pages for mobile.
