CSS权威指南 - 基础视觉格式化 3
行内替换元素
替换元素比如图片的高度比line-height大,并不会影响整个文字段落的line-height,会让有图片那一行框的高度可以容纳这个图片。

这个图片依然有一个line-height,和在一起的行内元素一样,因为垂直对齐vertical-align值为百分比时要在这个基础上计算。
* * *
增加框属性
替换元素的内容区包括,元素的内外边距及边框。会影响当前行的行框高。

margin可以为负值,负边距是挤入其他行的唯一方法。
* * *
替换元素和基线
替换元素位于基线之上。

这样的方式造成的问题:
表格单元的图片,单元里没有其他内容,图片还是会在基线之上布局。但是在火狐上测试了并不会。另一个问题,行内替换元素margin-bottom设置成负数的时候,和一般情况,将下面的部分往上拉不同。因为行内框比内容区要高,因为行内框位于基线上提高了。
CSS权威指南 - 基础视觉格式化 3的更多相关文章
- CSS权威指南 - 基础视觉格式化 2
行内元素 em a 非替换元素 img 替换元素 两者在内联内容处理方式不一样. inline有时候被翻译成内联,比如inline content,有时候被翻译成行内 inline box. 行布局 ...
- css权威指南-基本视觉格式化(水平与垂直)
1.基本概念 (1)正常流:是指西方语言文本从左向右,从上向下显示.如果要让一个元素不在正常流中国,唯一的办法 就是使之成为浮动或定位元素. ( ...
- CSS权威指南 - 基本视觉格式化 4
改变元素显示 没有讨论与表格相关的.列表list-item的值.之后讨论. 改变显示角色 显示为块级元素 将一串链接(行内元素)改变垂直放置,若有如下一连串的链接: <div id=" ...
- CSS权威指南 - 基本视觉格式化 1
定位 定位的想法很简单元素框相对于正常位置出现在哪里. 定位:static,相对, 绝对, fixed, 继承 static就是默认的位置 相对就是相对于默认位置的偏移.原来的static定位位置依然 ...
- 《CSS权威指南》基础复习+查漏补缺
前几天被朋友问到几个CSS问题,讲道理么,接触CSS是从大一开始的,也算有3年半了,总是觉得自己对css算是熟悉的了.然而还是被几个问题弄的"一脸懵逼"... 然后又是刚入职新公司 ...
- CSS权威指南学习笔记系列(1)CSS和文档
题外话:HTML是一种结构化语言,而CSS是它的补充:这是一种样式语言.CSS是前端三板斧之一,因此学习CSS很重要.而我还是菜鸟,所以需要加强学习CSS.这个是我学习CSS权威指南的笔记,如有不对, ...
- CSS权威指南 - 层叠
CSS权威指南 第三章结构与层叠 - 层叠 按权重及来源排序 1. Reader important declarations 2. Author important declarations 3. ...
- css权威指南读书笔记-第10章浮动和定位
这一章看了之后真是豁然开朗,之前虽然写了圣杯布局和双飞翼布局,有些地方也是模糊的,现在打算总结之后再写一遍. 以下都是从<css权威指南>中摘抄的我认为很有用的说明. 浮动元素 一个元素浮 ...
- css权威指南读书笔记
今天翻手机,翻到了许久之前看css权威指南时的笔记,遂移到博客中来. 1.属性选择器p.one class名为one的p元素p[class][name] 含有class和name属性的p元素p[cla ...
随机推荐
- HTML元素的属性
HTML元素的属性,每个元素都有多个属性值 <p>段落标记</p> <font size=“”>字体大小标记</font>size取值1-7 <h ...
- 几个Windows电脑小技巧
1. 为cmd命令提示符设置默认的初始路径: 到开始菜单-附件-属性 里面有起始位置选项 其中%HOMEDRIVE%%HOMEPATH%就代表起始位置 如想每次键cmd进入命令提示符后的初始位置是 ...
- C# 字符串格式化
1.格式化货币(跟系统的环境有关,中文系统默认格式化人民币,英文系统格式化美元) string.Format("{0:C}",0.2) 结果为:¥0.20 (英文操作系统结果:$0 ...
- 【POJ2096】Collecting Bugs 期望
[POJ2096]Collecting Bugs Description Ivan is fond of collecting. Unlike other people who collect pos ...
- Boom.TV完成350万美元融资,目标直指VR电竞直播
3D在线电竞直播平台Boom.tv刚刚宣布已经完成350万美元的融资,该平台旨在让观众在任何设备以任意视角观看电竞比赛,并将支持VR版本. 这家位于美国加州红木城的初创公司成立于2015年,由Gupt ...
- 解决HttpServletResponse输出的中文乱码问题
http://blog.csdn.net/simon_1/article/details/9092747 首先,response返回有两种,一种是字节流outputstream,一种是字符流print ...
- Codeforces Round #253 (Div. 2) B - Kolya and Tandem Repeat
本题要考虑字符串本身就存在tandem, 如测试用例 aaaaaaaaabbb 3 输出结果应该是8而不是6,因为字符串本身的tanderm时最长的 故要考虑字符串本身的最大的tanderm和添加k个 ...
- IOS学习笔记25—HTTP操作之ASIHTTPRequest
IOS学习笔记25—HTTP操作之ASIHTTPRequest 分类: iOS2012-08-12 10:04 7734人阅读 评论(3) 收藏 举报 iosios5网络wrapper框架新浪微博 A ...
- ACM: hdu 2647 Reward -拓扑排序
hdu 2647 Reward Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Des ...
- 【BZOJ】1135: [POI2009]Lyz
题意 有\(1\)到\(n(1 \le n \le 200000)\)号的溜冰鞋各\(k(1 \le k \le 10^9)\)双.已知\(x\)号脚的人可以穿\(x\)到\(x+d\)的溜冰鞋. 有 ...