两列布局的几种实现方案

最新推荐文章于 2022-09-05 18:21:21 发布

helloxielan

最新推荐文章于 2022-09-05 18:21:21 发布

阅读量932

点赞数

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/zjf-1992/p/6364078.html

版权

方案一、基于浮动实现两列布局方案

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>方案一：基于浮动实现两列布局</title>
		<style>
		     body {
		     	margin: 0;
		     }
			.content {
				overflow: hidden;
				width: 960px;
				margin: 0 auto;
				background-color: #CECECE;
			}
			
			/*主要内容primary*/
			.primary {
				float: left;
				width: 220px;
				padding-right: 20px;
				height: 400px;
				background-color: #00AABB;
				display: inline;/*消除IE6 bug双倍外边距*/
			}
			/*次要内容secondary*/
			.secondary {
				float: right;
				width: 700px;
				height: 400px;
				background-color: deeppink;
				display: i

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

helloxielan

关注关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
两列布局的几种实现方案

方案一、基于浮动实现两列布局方案<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>方案一：基于浮动实现两列布局</title> <style> body { margi...
复制链接

扫一扫