Skip to main content

Create responsive html webpage

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Lingo Chaps Chinese Translators</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=UTF-8" />
<meta http-equiv="Content-Language" content="en" />
<script src="http://code.jquery.com/jquery-1.11.1.js" type="text/javascript"></script>
<link href="css/style.css" rel="stylesheet"  type="text/css"></link>
<script  type="text/javascript">
$(document).ready(function(){
$(".mcmb").click(function(){
$(".menu1").slideToggle('slow')
});
});
</script>
</head>
<body>


YOUR CODE GOSE HERE

</body>




Now copy and paste this style coad in to notepad 

and save as style.css

keep THIS file in CSS  folder


{

// your defaut style gose here----------

}
@media only screen and (min-width: 480px)
{

// style for 480px screen gose here-------------

}
@media only screen and (min-width: 768px)
{
// style for 768px screen gose here-------------
}
@media only screen and (min-width: 480px)
{

// style for 480px screen gose here-------------


}
@media only screen and (min-width: 768px)
{



// style for 768px screen gose here-------------




}


Now you can start working on it






Labels:

Comments

Post a Comment

Popular posts from this blog

Wo-commerce sidebar navigation

There is Plus Minus Image you can change it in your own code
Post a Comment
Read more

How to add attribute in input type onload

Add this script this will target your input type submit and set an attribute on it when page load. <script> function functionAddAttribute(){     $("input:submit").attr("accesskey","g"); }; window.onload = functionAddAttribute; </script> <noscript>Your browser does not support JavaScript!</noscript> This is html <input type="submit" value="this is button" />
Post a Comment
Read more

HOW TO IMPLEMENT ADAPTIVE IMAGE IN WORDPRESS

If you don't know about Adaptive image please Read my last artical. STEP:1 COPY .htaccess , Adaptive-image.php, ai-cookie.php, DS_Store file in your root directory STEP 2: CREATE folder in wp-contant/uploads/adaptive/ai-cache if .htaccess file already exist then pest this code in it but be carefull take its backup CODE #START Adaptive-Images #Add any directories you wish to omit from the Adaptive-Images process on a new line. #Omit plugins, wp-includes and wp-admin content. RewriteCond %{REQUEST_URI} !wp-content/plugins RewriteCond %{REQUEST_URI} !wp-includes RewriteCond %{REQUEST_URI} !wp-admin #Send any GIF, JPG, or PNG request that IS NOT stored inside one of the above directories #to adaptive-images.php so we can select appropriately sized versions RewriteRule .(?:jpe?g|gif|png)$ adaptive-images.php #END Adaptive-Images UNDER # BEGIN WordPress <IfModule mod_rewrite.c> RewriteEngine On STEP3: Open Adaptive-image.php change with it $cache_path    = "wp-content/upl...
Post a Comment
Read more