css布局笔记
1、display block块级元素(div、p等) inline 行内元素(a、span等)
常见的例子:把li修改成inline ,制作成水平菜单
2、max-width 来适应不同浏览器窗口大小,IE7+都支持这一属性
3、box-sizing:border-box 将元素设置这一属性时,元素的内边距和边框不会影响其内容宽度,再也不需要计算内容宽度的值了。
缺点就是不同浏览器内核要分别设置,并只支持IE8+
4、position
5、浮动与display:inline-block 的区别与用法 教程见 http://zh.learnlayout.com/toc.html
css布局笔记的更多相关文章
- “学习CSS布局” 笔记
学习网址:http://zh.learnlayout.com/no-layout.html 本文仅为学习笔记,内容非原创. position 默认值:static 没有添加额外属性的relative和 ...
- css布局笔记(三)圣杯布局,双飞翼布局
圣杯布局和双飞翼布局都是三列布局,两边定宽,中间自适应布局,中间栏要在放在文档流前面以优先渲染. 圣杯布局如下 <!-- 圣杯布局 --> <!DOCTYPE html> &l ...
- css布局笔记(二)Flex
flex Flex是"Flexible Box"的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性. 任何一个容器都可指定为Flex布局. .box{di ...
- css布局笔记(一)
布局方式 一列布局 通常固定宽高,用margin:0 auto:居中显示 两列布局 说起两列布局,最常见的就是使用float来实现.float浮动布局的缺点是浮动后会造成文本环绕等效果,以及需要及时清 ...
- CSS布局基础
(初级)css布局 一.单列布局1.基础知识块级元素 div p ul li dl dt 行级元素 img span input strong同一行显示.无换行2.盒子模型盒子模型 (边框border ...
- 《深入理解bootstrap》读书笔记:第三章 CSS布局
一. 概述一下理念 bootstrap基于H5开发.提倡移动先行(媒询声明是必须的),对浏览器支持面不是很广. 响应式图片:max-width:100% height:auto; 可以加上:.img- ...
- CSS 小结笔记之解决flex布局边框对不齐
在使用flex 进行伸缩布局的时候,经常会给子盒子设置边框,这时经常会出现上下边框对不齐的情况.本篇文章来探讨并解决这个问题. 具体出现的问题如下图所示 具体代码如下 <!DOCTYPE htm ...
- HTML+CSS学习笔记 (12) - CSS布局模型
标签:HTML+CSS css布局模型 清楚了CSS 盒模型的基本概念. 盒模型类型, 我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是 CSS 最基本. 最核心的概念. 但布局模型是 ...
- HTML&CSS精选笔记_布局与兼容性
布局与兼容性 CSS布局 版心和布局流程 为什么要应用布局? 阅读报纸时容易发现,虽然报纸中的内容很多,但是经过合理地排版,版面依然清晰.易读.同样,在制作网页时,要想使页面结构清晰.有条理,也需要对 ...
随机推荐
- keras多层感知机MLP
肯定有人要说什么多层感知机,不就是几个隐藏层连接在一起的吗.话是这么说,但是我觉得我们首先要自己承认自己高级,不然怎么去说服(hu nong)别人呢 from keras.models import ...
- nginx+lua 设置跨域
nginx 配置: header_filter_by_lua_file cros.lua; access_by_lua ' if ngx.var.request_method == "OPT ...
- 【JavaScript】使用定时器实现Js的延期执行或重复执行setTimeout,setInterval
使用定时器实现JavaScript的延期执行或重复执行 window对象提供了两个方法来实现定时器的效果,分别是window.setTimeout()和window.setInterval.其中前者可 ...
- osg fbx 模型结构操作
osg::Node* TeslaManage::findOsgNodeByName(QString &nodeNme) { osg::Node* findNode = NULL; std::v ...
- 阶段5 3.微服务项目【学成在线】_day18 用户授权_15-细粒度授权-我的课程细粒度授权-实现
先定义接口 实现接口 service 需要通过conpanyId去查询课程的列表 定义dao 要查课程的图片 名称 等相关信息.所以使用Mybatis来实现 定义Mapper 看这个dao里面方法在哪 ...
- 一百四十一:CMS系统之根据板块过滤显示帖子
视图,根据传过来的板块id查数据 @bp.route('/')def index(): board_id = request.args.get('board_id', type=int, defaul ...
- caffe dropout解读
先上caffe dropout_layer.cpp源码,如下: // LayerSetUp DCHECK(threshold_ > 0.); DCHECK(threshold_ < 1.) ...
- 微信服务号一些记录,与DTCMS微信功能二次开发
1.首先必须获得Token CRMComm crm = new CRMComm(); string error = ""; string ...
- iOS-UITextField和UITextView隐藏键盘
UITextField和UITextView隐藏键盘 71 views, IOS DEV, by admin. self._textField.returnKeyType=UIReturnKeyDon ...
- .Net Core 请求上下文IHttpContextAccessor
namespace Microsoft.AspNetCore.Http { public interface IHttpContextAccessor { HttpContext HttpContex ...