zoukankan      html  css  js  c++  java
  • 网站首页之早期布局

    网站首页之早期布局方法,虽然现在基本不用了,但是我感觉还是应该知道的,说你不定哪一年的哪一天这种布局格式又火了。不排除这种可能,就像十年之前非常流行的喇叭裤一样,说不定十年之后这种网站布局方式又火了呢?,至少值得收藏。当然,后期还会给出目前计算机行业比较流行的网站布局方式。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    	<title>float</title>
    	<style type="text/css">
    	*{
    		margin: 0px;
    		padding: 0px;
    	}
    	.index{
    		 960px;
    		margin: 0px auto;
    	}
    	.logo{
    		height: 160px;
    		background-color: red;
    	}
    	.nav{
    		height: 45px;
    		background-color: green;
    	}
    	.scroll{
    		height: 30px;
    		background-color: yellow;
    		line-height: 30px;
    	}
    	.con{
    		height: 450px;
    		background-color: skyblue;
    	}
    	.con-left{
    		float: left;
    		 36%;
    		height: 450px;
    		background-color: #123;
    	}
    	.con-center{
    		float: left;
    		 36%;
    		height: 450px;
    		background-color: red;
    		margin-left: 0.5%;
    	}
    	.con-right{
    		float: right;
    		 27%;
    		height: 450px;
    		background-color: #789;
    	}
    	.top{
    		height: 223px;
    		background-color: #afc;
    	}
    	.bottom{
    		margin-top: 5px;
    		height: 222px;
    		background-color: #d0f;
    	}
    	.footer{
    		height: 55px;
    		background-color: #254;
    	}
    	</style>
    </head>
    <body>
    	<div class="index">
    		<div class="logo"></div>
    		<div class="nav"></div>
    		<div class="scroll">
    			<marquee behavior="" direction="">重要通知</marquee>
    		</div>
    		<div class="con">
    			<div class="con-left">1</div>
    			<div class="con-center">2</div>
    			<div class="con-right">
    				<div class="top">
    					上
    				</div>
    				<div class="bottom">
    					下
    				</div>
    			</div>
    		</div>
    		<div class="footer"></div>
    	</div>
    </body>
    </html>
    

      效果图在这儿,太丑,但是技术真的很实在。

  • 相关阅读:
    环境配置文件 ① /etc/profile、② ~/.bash_profile、③ ~/.bashrc、④ /etc/bashrc
    RHEL 7.0已发布CentOS 7即将到来
    《上海交通大学饮水思源paper(论文)板实用手册(第二版)》出炉
    SCI论文投稿Cover Letter的写作
    grub.cfg —— Window、Fedora、CentOS
    SCI新手成长策略
    计算机类SCI前三区期刊
    SCI期刊——导航
    SCI收录的外文期刊(计算机类)
    《嵌入式开发》——三次作业
  • 原文地址:https://www.cnblogs.com/myprogramer/p/6551433.html
Copyright © 2011-2022 走看看