田字格布局html div
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>田字格布局</title>
<style>
#prat1{
width: 200px;
height: 200px;
background: #CDAD00;
float: left;
}
#prat2{
width: 200px;
height: 200px;
background: #CD6839;
float: left;
}
#prat3{
width: 200px;
height: 200px;
background: #CD6090;
float: left;
clear: left;
}
#prat4{
width: 200px;
height: 200px;
background: #CD3333;
float: left;
}
</style>
</head>
<body>
<div id="prat1">块1</div>
<div id="prat2">块2</div>
<div id="prat3">块3</div>
<div id="prat4">块4</div>
</body>
</html>
田字格布局html div的更多相关文章
- css田字格布局
<!DOCTYPE html> <html> <head> <title></title> <style type="tex ...
- 常用布局，div竖直居中
常用两列布局,多列布局和div竖直居中 body { margin:; padding:; } .w200 { width: 200px; } .mar-left200 { margin-left: ...
- CSS布局：div高度随窗口变化而变化(BUG会有滚动条)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 浅谈分析表格布局与Div+CSS布局的区别
(1)表格布局 表格布局容易掌握,布局方便.但表格布局需要通过表格的间距或者使用透明的gif图片来填充布局板块间的间距,这样布局的网页中表格会生成大量难以阅读和维护的代码:而且表格布局的网页要等整个表 ...
- 2017-12-04HTML布局＿div布局
HTML布局＿div布局 <!doctpye> <html> <head> <meta charset = 'utf-8'> <title> ...
- HTML 布局 - 使用<div> 元素
网站布局 大多数网站会把内容安排到多个列中(就像杂志或报纸那样).高佣联盟 www.cgewang.com 大多数网站可以使用 <div> 或者 <table> 元素来创建多列 ...
- CSS布局之div交叉排布与底部对齐--flex实现
最近在用wordpress写页面时,设计师给出了一种网页排布图样,之前从未遇到过,其在电脑上(分辨率大于768px)的效果图如下: 而在手机(分辨率小于等于768px)上要求这样排列: 我想到了两种方 ...
- [转]CSS网页布局：div水平居中的各种方法
http://jingyan.baidu.com/article/fa4125ac90a2a328ac70929e.html 在Web标准中的页面布局是使用Div配合CSS来实现的.这其中最常用到的就 ...
- 【html】【8】div布局[子div在父div居底]
从今天起 开始细话div布局 思路及要点: 父div的位置设置成相对的,即“position: relative;”. 而子div的位置设置成绝对的,并且下边缘设为0,即“position: ab ...
随机推荐
- 改进Source Insight对汉字的支持
转自:http://blog.chinaunix.net/u/8681/showart_1356633.html http://blog.163.com/zhuzhihuacan@126/blog/s ...
- 大括号对struct进行初始化
1 partial initialization 即所谓的部分初始化. 这个时候,无论该struct变量是static的还是automic的,未显式初始化的成员都会被初始化为默认值.
- Facebook Flux 分析
首先是actions使用了Dispatcher来定义分发事件, Store在Dispatcher里注册自己的ActionType,收到对应的Action后修改Store内部的结构 Store emit ...
- bzoj1861 [Zjoi2006]Book 书架——splay
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1861 发现自己想splay的时候总是纠结那个点权是什么,因为splay原本是二分查找树... ...
- 【转载】SQL面试题
[本文转自]http://blog.csdn.net/u012467492/article/details/46790205 1.用一条SQL 语句 查询出每门课都大于80 分的学生姓名 name ...
- Ruby模块与类
Ruby是单一继承,一个类只能有一个直接的母类 Mix-in 模式来处理复合需求 多重包含: 由下往上回溯,重复的只看最上方的 换句话说,程序由上往下执行,由具体到抽象,第二次发现同一个模块 ...
- 重启fpm
ps aux | grep php-fpm cat /etc/php-fpm.conf kill -USR2 `cat /run/php-fpm/php-fpm.pid
- bzoj 2784: [JLOI2012]时间流逝【树形期望dp】
来自lyd课件 发现s和last(s),next(s)成树结构,然后把式子化简成kx+b的形式,做树形dp即可 #include<iostream> #include<cstdio& ...
- bzoj 3528 [Zjoi2014]星系调查【树链剖分+数学】
参考:https://www.cnblogs.com/zhuohan123/p/3698852.html 首先,根据点到直线距离公式 \[ d=\frac{kx_0-y_0+b}{\sqrt{k^{2 ...
- 百度地图API详细介绍
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...