用div和css样式控制页面布局
2024-10-12 07:11:22
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>网页布局练习</title> <link href="../EX_Asp_Net/css/div.css" rel="stylesheet" />
</head>
<body>
<h1 align="center">利用div和css对页面的布局进行调整</h1><hr />
<div class="d1">
<h3>窗口1</h3>
</div>
<div class="d2"><h3>窗口2</h3></div>
<div class="d3"><h3>窗口3</h3></div>
</body>
</html>
css代码:
bod {
margin:100%;
padding:100%; }
.d1{
width:200px;
height:600px;
background-color:red;
margin-left:20px;
margin-top:20px;
position:absolute;
}
.d2{
width:800px;
height:150px;
background-color:greenyellow;
position:absolute;
left:235px;
margin-top:20px; }
.d3{
width:800px;
height:420px;
position:absolute;
left:235px;
background-color:#19a1f8 ;
margin-top:200px; }
最新文章
- iOS 利用Charles抓包
- T-SQL 语句的优化
- 深入grootJs(进阶教程)
- SQLServer2008:助您轻松编写T-SQL存储过程(原创)【转】
- adb 修改system文件
- MAC的一些实用
- WebLogic启动时报错
- android数据库持久化框架
- URL特殊字符需转义
- VS2008与opencv结合使用的方法
- 基于docker的 Hyperledger Fabric 多机环境搭建(上)
- Python 错误 UnicodeEncodeError: &#39;ascii&#39; codec can&#39;t encode character 的解决方案
- Js常用的函数
- JSP标签JSTL(2)--流程控制
- MVC Repository模式
- android ROM刷机updater-script单刷补丁包脚本
- RocketMQ源码分析:(一)安装与案例演示
- C#中抽象类(abstract)和接口(interface)的实现
- “数学口袋精灵”第二个Sprint计划(第五天)
- 在vue中如何动态修改title标签的值