人机交互第五次作业-白红宇

人机交互第五次作业

阅读量：4568 次

发布时间：2019-06-08

本文共 2864 字，大约阅读时间需要 9 分钟。

<html>

<head>

body{background-color:grey;

text-align:center;

margin:0;

padding:0;}

#wrapper{background:white;

width:800px;

margin:0 auto;

text-align:left;}

#branding{background:#aaaaaa;

height:120px;

line-height:120px;

font-size:2em;

text-align:center;

}

#footer{background:black;

color:white;

height:80px;

line-height:80px;

font-size:1.5em;

text-align:center;

clear:both;}

#content{background:yellow;

width:619px;

float:right;}

#mainNav{

width:180px;

float:left;}

</style>

</head>

<body>

北京联合大学

</div>

内容<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

</div>

<ul>

<li><a href="#">智慧城市学院</a></li>

<li><a href="#">自动化学院</a></li>

</ul>

</div>

</div>

</body>

</html>

<html>

<head>

body{background-color:grey;

text-align:center;

margin:0;

padding:0;}

#wrapper{background:white;

width:800px;

margin:0 auto;

text-align:left;}

#branding{background:#aaaaaa;

height:120px;

text-align:center;

position:relative;}

#branding div{font-size:2em;

line-height:100px;}

/**********/

#branding ul{list-style:none;

margin:0;

padding:0;

position:absolute;

right:0;

bottom:0;}

#branding ul li{float:left;}

#branding ul a{

text-decoration:none;

background:black;

color:white;

line-height:2em;

border-right:solid white 1px;

padding:0 2em;

float:left;

}

#branding ul a:hover{background:#bbbbbb;

color:white;}

/***********/

#footer{background:black;

color:white;

height:80px;

line-height:80px;

font-size:1.5em;

text-align:center;

clear:both;}

#content{background:yellow;

width:500px;

float:right;}

#mainNav{

width:180px;

float:left;}

#mainNav ul{list-style:none;

margin:0;

padding:0;}

#mainNav ul a{

text-decoration:none;

background:black;

color:white;

display:block;

width:150px;

line-height:2em;

border-bottom:solid white 1px;

text-indent:5px;

}

#mainNav ul a:hover{background:#bbbbbb;

color:white;}

</style>

</head>

<body>

<div>北京联合大学</div>

<ul>

<li><a href="#">自动化学院</a></li>

</ul>

</div>

内容<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

</div>

<ul>

<li><a href="#">智慧城市学院</a></li>

<li><a href="#">自动化学院</a></li>

</ul>

</div>

</div>

</body>

</html>

转载于:https://www.cnblogs.com/hhhhg/p/7853469.html

你可能感兴趣的文章

136. Single Number； 137. Single Number II；260. Single Number III; 287. Find the Duplicate Number

查看>>

Android游戏可能遇到的3个问题及解决方案

查看>>

浅谈innerHTML,innerText与outerHTML,outerText的区别

查看>>

shell中的declare命令

查看>>

SQL Server— 存在检测、建库、建表、约束、外键、级联删除

NSString和NSMutableNSString的基本用法

查看>>

Selenium_WebDriver_定位元素

查看>>

spring 的redis操作类RedisTemplate

Json-lib 进行java与json字符串转换之一

查看>>

c++基础知识学习-----数据程序的储存、表示形式和基本运算

查看>>

python cookbook读书笔记1 第一章数据结构和算法1

查看>>