企业实训第六节

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<!--引入css文件用link标签-->

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

<!--<script type="text/javascript" src=""></script>-->

</head>

<body>

<div class="father">

<div class="head">

</div>

<div class="banner">

<a href=""> 首页 </a>

<a href="">日志 </a>

<a href="">相册 </a>

<a href="">留言板 </a>

<a href="">关于我 </a>

</div>

<div class="left"><br/>

<span>>>关于我<br/></span>

<img src="109395CF4-7.jpg" height="220" width="240" align="middle"/><br/>

  <img src="girl.gif" align="middle"/>
  
   <span>张梅</span>
   
   <span>重庆市 南岸区</span>
   
   <font color="#FF0000">天微明,冬天的光透过窗,印在左手的无名指上。 回忆的颜色是透明的冷,于是,用窗口透入的薄薄的光暖一暖心。</font>

</div>

<div class="right"><br/>

<table width="450" border="1" height="220">

<tr class="right1">

<td>>>日志</td>
 </tr> 
 <tr>
<td>IMAX加长版《变形金刚》(Transformers)亲历简报 2007-09-25 </td>

</tr> <tr> <td>变形金刚》发烧友的看图说话(多图) 2007-09-22</td> </tr>

<tr> <td>《反恐王国》(The Kingdom):生猛的空心弹 2007-09-22</td> </tr>

<tr> <td>《东方承诺》(Eastern Primises):不动如山,暗流汹涌 2007-09-20</td> </tr>

<tr> <td>《妖精的旋律》(Elfen Lied):日式YY的经典案例 2007-09-20</td> </tr>

<tr> <td> </td> </tr>

</table><br/>

<div class="right1">>>相册</div>

<div class="minfather">

<div class="m-left">

<img src="1.jpg" width="150" height="200"/>

</div>

<div class="m-mid">

<img src="2.jpg" width="150" height="200"/>

</div>

<div class="m-right">

<img src="3.jpg" width="150" height="200"/>

</div>

</div>

<div class="footer">

临大17级

</div>

</div>

</body> </html>

css:

@charset "utf-8";

/* CSS Document */ *{/通配符选择器/

margin:0px;
padding:0px;

}

ul{

list-style:none;

}

.father {

width: 800px;

height: 600px;

position: absolute;

left: 250px;

top: 20px;

margin:auto;

}

.head {

width: 800px;
height: 100px;

background-image:url(banner.gif);

text-align:center;

}

.banner {

width: 800px;
height: 10px;

background-color:#FC6;

top: 100px;

height: 2em;

line-height: 2em;

overflow: hidden;

}

.left {

height: 440px;

width:350px;

float: left;

}

.right{

width: 450px;

height:440px;

float: left;

}

.right1 {

background-color:#FCEAA8;

}

.minfather{

width:450px;

height:220px;;

}

.m-left{

float:left;

}

.m-mid{

float:left

}

.m-right{

float:left;

}

.footer{

width:800px;
height:30px;

background-color:#FC3;

clear:none;

}

转载于:https://my.oschina.net/u/4090474/blog/3034846

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值