CSS 笔记(一)
学习了张鑫旭大神的浮动教程,记一下笔记。
浮动最开始是为了文字环绕图片效果。
浮动会破坏父元素的包裹。
清除浮动:在父元素加上clearfix(after不兼容ie6 7,zoom为ie6 7下方法)
clearfix:after {
content:"";
display:table;
clear:both;
}
clear {
zoom:;
}
浮动可以去空格化。
流体化布局,普通:
左侧 { width: 56px; float: left; }
右侧 { margin-left: 76px; }
流体化布局 ,左右自适应宽度变化:
左侧 { float: left; margin-right: 20px; }
右侧 { display: table-cell; *display: inline-block; width: 2000px; *width: auto; }
CSS 笔记(一)的更多相关文章
- HTML+CSS笔记 CSS笔记集合
HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...
- CSS笔记--选择器
CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...
- HTML+CSS笔记 CSS中级 一些小技巧
水平居中 行内元素的水平居中 </a></li> <li><a href="#">2</a></li> &l ...
- HTML+CSS笔记 CSS中级 颜色&长度值
颜色值 在网页中的颜色设置是非常重要,有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 语法: p{co ...
- HTML+CSS笔记 CSS中级 缩写入门
盒子模型代码简写 回忆盒模型时外边距(margin).内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的:上右下左. 语法: margin:10px 15p ...
- HTML+CSS笔记 CSS进阶再续
CSS的布局模型 清楚了CSS 盒模型的基本概念. 盒模型类型, 我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是 CSS 最基本. 最核心的概念. 但布局模型是建立在盒模型基础之上, ...
- HTML+CSS笔记 CSS进阶续集
元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...
- HTML+CSS笔记 CSS进阶
文字排版 字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性. 语法: body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果 ...
- HTML+CSS笔记 CSS入门续集
继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代(标签). 语法: p{color:red;} <p> ...
- HTML+CSS笔记 CSS入门
简介: </span>年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的<span>脚本解释程序</span>,作为ABC语言的一种继承. & ...
随机推荐
- makefile怎么写?
参考:https://blog.csdn.net/haoel/article/details/2886 https://blog.csdn.net/haoel/article/details/2 ...
- maven 相关问题
maven 这里要更新完 不一定非要clean install 那个出问题了再弄,一般刷新一下maven仓库就行了,最好还是用自己配置的maven,不容易出问题
- Unity接入监控摄像头
公网RTSP测试地址: rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov RTSP测试软件: EasyPlayerRTSP: https:// ...
- Vue.js 相关知识(脚手架)
1. vue-cli 简介 Vue-cli 是 vue的设计者,为提升开发效率而提供的一个脚手架工具,可通过vue-cli快速构造项目结构 2. vue-cli 安装步骤 安装npm 或 cnpm n ...
- mysql学习(3)10045错误,连接不上数据库
mysql8.0默认加密的方式是caching_sha2_password认证方式,当使用navicat 或者程序连接是连接不上, 好吧,那我们修改配置并重启服务可以解决此问题 找到mysql的配置文 ...
- 《Linux内核设计与实现》第一二章读书笔记
第一章 Linux内核简介 1.Unix简介 (一)概念:支持抢占式多任务.多进程.虚拟内存.换页.动态链接和TCP/IP网络的现代化操作系统. (二)Unix特点(层次化结构): Unix很简洁,仅 ...
- 第二阶段Sprint9
昨天:重新规划主界面,把视频录制暂放到主页面里 今天:查看有关“共享平台”的资料,看如何实现上传下载功能,并尝试编码, 遇到的问题:看不懂什么意思,照例子做不行,还得需要联网等
- 重温jsp①
Jsp就是一个servlet servlet的缺点 不适合设置html响应体,需要response.Getwriter.print(); 优点:动态资源,可以编程. Jsp:在原有的html中加入了J ...
- 浅谈个人对RAID技术的理解
RAID,字面意思为一种廉价的冗余磁盘阵列,它是通过将大量的磁盘分组,实现了数据冗余,目的是为了保护数据.RAID现已经应用于计算机各个领域.它的优点是降低了工作成本并提高了效率,并且使系统有稳定的运 ...
- ElasticSearch 2 (34) - 信息聚合系列之多值排序
ElasticSearch 2 (34) - 信息聚合系列之多值排序 摘要 多值桶(terms.histogram 和 date_histogram)动态生成很多桶,Elasticsearch 是如何 ...