You Are Here:

Community: Wiki

This page was last modified on 28 September 2009, at 14:47.

Mobile Site Example

From Forum Nokia Wiki

Reviewer Approved   


Contents

Introduction

Below you can see the Live Example of Mobile Site. CSS Code For Mobile site is given below.


Style.css Code

.font6{font-size:xx-large;}
 
.font4{font-size:x-large;}
 
.font2{font-size:large;}
 
.font1{font-size:medium;}
 
.form_tag {
margin: 1px; padding: 1px; font-family: Arial, Tahoma, sans-serif; font-size: medium;
}
 
.search_button {
font-family: Arial, Tahoma, sans-serif; font-size: medium;
}
 
.header_center {
text-align:center;
}
 
.header_right {
text-align:right;
}
 
.header_left {
text-align:left;
}
 
a {
text-decoration: none;
}
 
.content img {
margin-right: 5px;
margin-top: 3px;
margin-left: 2px;
}
 
.homeng {
background-color: #CCCC99;
 
margin: 0px;
 
border-top-width: 1px;
 
border-right-width: 0px;
 
border-bottom-width: 1px;
 
border-left-width: 0px;
 
border-top-style: solid;
 
border-right-style: solid;
 
border-bottom-style: solid;
 
border-left-style: solid;
 
border-top-color: #FFFFFF;
 
border-bottom-color: #CCCCCC;
 
}
 
body
 
{ background-color: #ffffff; color: black; font-family: Arial, Tahoma, sans-serif; font-size: medium; margin: 0px; border: 0px; padding: 0px;}
.header
 
{ background-color: #003300; color: #FFFFFF; font-size: x-large; font-weight: bold; font-family: Arial, Helvetica, sans-serif; padding: 5px 0px 5px 2px; margin: 0px;}
.footer
 
{ color: #FFFFFF; background-color: #003300; font-family: Arial, Helvetica, sans-serif; font-size: medium; font-weight: normal; padding: 2px 0px 3px 3px; margin: 0px;}
.accesskey
 
{ text-decoration: underline; font-size: medium; color: #000000;}
.himgicon
 
{ height: medium; width: medium;}
.pgheader
 
{
color: #003300;
 
font-size: medium;
 
font-weight: normal;
 
padding: 1px 0px 1px 3px;
 
font-family: Arial, Helvetica, sans-serif;
 
background-color: #FFFFFF;
 
margin: 0px;
 
border-top-width: 1px;
 
border-right-width: 0px;
 
border-bottom-width: 1px;
 
border-left-width: 0px;
 
border-top-style: solid;
 
border-right-style: solid;
 
border-bottom-style: solid;
 
border-left-style: solid;
 
border-top-color: #003300;
 
border-right-color: #003300;
 
border-bottom-color: #003300;
 
border-left-color: #003300;
}
.footerng
 
{ background-color: #FFFFFF; color: #003300; font-size: medium;
 
font-weight: normal; font-family: Arial, Helvetica, sans-serif; padding: 1px 1px 1px 3px; margin: 0px; border-top-width: 1px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #003300; border-right-color: #003300; border-bottom-color: #003300; border-left-color: #003300;}
 
 
/* Design5 Style10 */
/* Editor Styles listed below */
.Heading {font-family: Arial, Tahoma, sans-serif; font-size: large; font-weight: bold; color: #000000; text-decoration: none; margin: 0px; padding: 0px;}
.BodyText { font-weight: normal; font-size: medium; padding: 0px 2px 0px 2px; MARGIN: 0px;}
.BoldText { font-weight: bold; font-size: medium;}
.Italic {font-style: italic;}
.Underline {text-decoration: underline;}
.Indent { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 5px;}
.Highlight { background-color: #999966; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; padding: 2px 0px 0px 0px; margin: 2px;}
.Line_HR {clear:both; border-bottom-color:#003300; border-top-color:#ffffff; border-left-color:#ffffff; border-right-color:#ffffff; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; padding: 0px; margin: 0px;}

Web_style.css Code

.font6{ font-size: 20px; font-weight: bold;}
 
.font4{ font-size: 16px; font-weight: bold;}
 
.font2{font-size: 12px;}
 
.font1{font-size: 11px;}
 
.form_tag {margin: 1px; padding: 1px; font-family: Arial, Tahoma, sans-serif;
font-size: 11px;}
 
.search_button {font-family: Arial, Tahoma, sans-serif; font-size: 11px;}
 
.header_center {TEXT-ALIGN:center;}
 
.header_right {TEXT-ALIGN:right;}
 
.header_left {TEXT-ALIGN:left;}
 
a { text-decoration: none; }
 
.content img { float: left; margin-right: 5px; margin-top: 3px; margin-left: 2px;}
 
.homeng {
background-color: #CCCC99;
margin: 0px;
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #FFFFFF;
border-bottom-color: #CCCCCC;
}
 
 
body { background-color: #ffffff; color: black; font-family: Arial, Tahoma, sans-serif; font-size: 8pt; margin: 0px; border: 0px; padding: 0px;}
.header
{
 
background-color: #003300; color: #FFFFFF; font-size: 18px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; padding: 5px 0px 5px 2px; margin: 0px;}
.footer
{
color: #FFFFFF; background-color: #003300; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: normal; padding: 2px 0px 3px 3px; margin: 0px;}
.accesskey
 
{ text-decoration: underline; font-size: 11px; color: #000000;}
.himgicon
 
{ height: 12px; width: 7px;}
.pgheader
 
{
color: #003300;
font-size: 11px;
font-weight: normal;
padding: 1px 0px 1px 3px;
font-family: Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
margin: 0px;
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #003300;
border-right-color: #003300;
border-bottom-color: #003300;
border-left-color: #003300;
}
.footerng
 
{ background-color: #FFFFFF; color: #003300; font-size: 11px; font-weight: normal; font-family: Arial, Helvetica, sans-serif; padding: 1px 1px 1px 3px; margin: 0px; border-top-width: 1px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #003300; border-right-color: #003300; border-bottom-color: #003300; border-left-color: #003300;}
/* Design5 Style10 */
/* Editor Styles listed below */
.Heading {font-family: Arial, Tahoma, sans-serif; font-size: 13px; font-weight: bold; color: #000000; text-decoration: none; margin: 0px; padding: 0px;}
.BodyText { font-weight: normal; font-size: 8pt; padding: 0px 2px 0px 2px; MARGIN: 0px;}
.BoldText { font-weight: bold; font-size: 11px;}
.Italic {font-style: italic;}
.Underline {text-decoration: underline;}
.Indent { margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 5px;}
.Highlight { background-color: #999966; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; padding: 2px 0px 0px 0px; margin: 2px;}
.Line_HR {clear:both; border-bottom-color:#003300; border-top-color:#ffffff; border-left-color:#ffffff; border-right-color:#ffffff; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; padding: 0px; margin: 0px;}

Mobile View of Site

Image:Screenshot-1.jpg Image:Screenshot-2.jpg Image:Screenshot-3.jpg Image:Screenshot-4.jpg Image:Screenshot-5.jpg Image:Screenshot-6.jpg Image:Screenshot-7.jpg File:Screenshot-8.jpg

Related Wiki Articles

No related wiki articles found

Rate This

 
Bookmark this page: DeliciousDiggFacebookGoogleYahooStumbleUponRedditDiigoTechnocratiTwitter  Share this page Share this page Print this Page Print this page Invite a friend Invite a friend
京ICP备05048969号    Email Newsletters Press Terms & Conditions Privacy Policy Sitemap Contact Us © 2009 Nokia 
User Rating: qfnZuserE5FratingQNx5E2E0000X