经典左右布局demo
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<!--<link rel="stylesheet" href="main.css">-->
<style>
.layout .sidebar { float: left; width: 150px; background: #fce3c5; height: 300px; }
.layout .primary { margin-left: 170px; background: #fce3c5; height: 300px; }
</style>
</head>
<body>
<div class="box bg layout clearfix">
<div class="sidebar">AAA</div>
<div class="primary">BBB</div>
</div>
</body>
</html>
经典左右布局demo的更多相关文章
- jqm的多列布局demo,html5的多列布局demo,多列布局的具体解说,html5开发实例具体解释
因为移动设备屏幕宽度较小,所以一般不建议使用多列布局.但有时你可能须要并排放置一些元素(如button之类的). jQuery Mobile通过约定的类名ui-grid来提供了一种基于css的多列布局 ...
- 【css】回想下经典的布局
看到这张图相信大多数人都很熟悉,这曾经是一种经典的布局方式,一道经典的面试题,一般形如"实现一个布局,左右固定宽度,中间自适应".随着岁月的流转,时光的交替(颇有一种“天下风云出我 ...
- 前端切图:手机端自适应布局demo
手机端自适应布局demo原型如下: 图片发自简书App 要求如下:适应各种机型源码如下: <!DOCTYPE html > <html> <head> <me ...
- CSS布局经典—圣杯布局与双飞翼布局
在我之前的博客网页整体布局完全剖析-剖完你不进来看一下么?中总结单列.两列.三列固宽与变宽布局,我还以为已经囊括了所有经典的网页布局方法了呢,当然除了CSS3的弹性盒模型没有涉及到,现在看来确实是自己 ...
- css+html简单的布局demo
于html介绍css作风.可以改变html块状布局,局更加美观.接下来看一个基础布局的小样例: <html> <head> <meta http-equiv=" ...
- 响应式布局 —— Demo
响应式布局实例演示What is 响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端--而不是为每个终端做一个特定的版本.这 ...
- 移动端布局Demo展示图文
上两张图自勉一下(来自刘墉先生的文章,最近看他的作品):然后移动端该愈来愈受到重视,未来的市场我不知道,不过我知道手机的功能越来越强大是不争的事实!移动端布局的积累也需要从现在做起! 需求一:实现下图 ...
- flex布局demo
flex布局 http://static.vgee.cn/static/index.html
- 浮动布局demo
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- Java系列学习(十三)-字符串
1.字符串基础 概念:字符串本质是打包字符数组的对象,是java.lang.String类的实例 2.字符串的构造方法 public String() public String(byte[] byt ...
- Python3 每次处理一个字符
""" Python3.4[文本]之每次处理一个字符 """ test_str = "my name is bixiaopeng& ...
- hdu3535题解
hdu3535:http://acm.hdu.edu.cn/showproblem.php?pid=3535 该题是非常全面的一道分组背包问题.其实理解了最多一个的分组背包问题,解题起来也是很简单的. ...
- iis设置404错误页，返回500状态码
一般在II6下,设置自定义404错误页时,只需要在错误页中选择自定义的页面,做自己的404页面即可.但是在IIS7.0及以上时,设置完404错误页后,会发现状态码返回的是500,并且可能会引起页面乱码 ...
- Angular——事件指令
基本介绍 angular的事件指令都是ng-click,ng-blur....的形式,类似于js的事件 基本使用 <!DOCTYPE html> <html lang="e ...
- CSS——tab导航demo
问题总结: 1.ul要比外套div宽度的值大一点 2.ul需要往左移动1px 3.外套的div设置overflow隐藏 解决抖动: 1.li宽度设置98px,padding左右值1px,hover之后 ...
- highcharts 组合chart
/** *制作 复杂的组合型的 charts * *@param [options] 图表的默认配置 *@dependence jQuery.highcharts *@author wch */ fu ...
- 遍历select搜索结果，只取数字标key值，防止重复
//遍历select搜索结果,只取数字标key值,防止重复 foreach ($row as $key => $value) { if (is_int($key)) { echo $value; ...
- 前端精选文摘：css之GFC 神奇背后的原理（整理）
CSS3 Grid Layout Web页面的布局,我们常见的主要有“浮动布局(float)”.“定位布局(position)”.“行内块布局(inline-block)”.“CSS3的多栏布局(Co ...
- EF入门
1.(安装EF)右键项目