Apparel Software

Powered by Blogger.

CSS Programming for Wordpress Website Part4

Basic Layout HTML Code:

<!doctype html - 13/02/17>
<meta charset="utf-8">
<title>Untitled Document</title>

<link href="css/basic_layout.css" rel="stylesheet" type="text/css">

<div class="main_layout">
<div class="header_area">
<div class="logo_area"> </div>
<div class="menu">
<li> <a href="index.html">HOME </a></li>
<li> <a href="about.html">ABOUT</a></li>
<li> <a href="client.html">CLIENT </a></li>
<li> <a href="gallery.html">GALLERY</a></li>
<li> <a href="contact.html">CONTACT</a></li>

<div class="slider_area"> </div>

<div class="box1_area" ></div>

<div class="box2_area"> </div>
<div class="box3_area"> </div>
<div class="footerarea">
<div class="footer_leftarea">&copy;copyright 2017 </div>
<div class="footer_rightarea"><u> ADDRESS:</u><br/>
New Horizons <br/>
Dhaka 1200 </div>



Basic Layout CSS Code:

@charset "utf-8";
/* CSS Document */
{ background-color:#CCC; margin:0px;}
{width:960px; height:900px;  margin:0px auto; background-color:#333;
{width:900px; height:150px;  margin:10px 30px 5px 30px; background-color: #FFF; float:left;

{width:200px; height:150px;  margin:0px; background-color: #666; float:left;
{width:700px; height:35px;  margin:115px 0px 0px 0px ; background-color: #CCC; float:left;
.menu ul
{ margin:0px; padding:0px; list-style:none;}
.menu li
.menu a{ width:138px; height:35px; float:left; background-color:#C60;
letter-spacing:3px; color:#FFF; line-height:35px; text-align:center;
text-decoration:none; margin:0px 1px; font-weight:bolder;
.menu a:hover
{ background-color:#F96;}

{width:900px; height:350px;  margin:0px 30px 5px 30px; background-color: #FFF; float:left;
{width:300px; height:250px;  margin:0px 0px 5px 30px; background-color: #FCC; float:left;
{width:290px; height:250px;  margin:0px 5px 5px 5px; background-color: #9CF; float:left;
{width:300px; height250px;  margin:0px 30px 5px 0px; background-color: #FCC; float:left;
{width:900px; height:120px;  margin:0px 30px 5px 30px; background-color: #FFF; float:left;
{width:300px; height:120px;  margin:0px;  float:left; text-align:center; line-height:120px; letter-spacing:3px; font-size:12px;
{width:300px; height:90px;  margin:0px; background-color: #96C; float: right; text-align:center; padding-top:30px;

Basic Layout Result of Above Code:


Share :

Facebook Twitter Google+ Linkedin
0 Comments "CSS Programming for Wordpress Website Part4"

Back To Top