仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 718|回复: 8
打印 上一主题 下一主题

[DIV+CSS] CSS教程之CSS教程:line-height属性的承继

[复制链接]
飘灵儿 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:10:46 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
每个声明内只能有一个属性,如果属性值中含有空格用双引号括起来例,在一个声明块内可以有多个声明,每个声明用分号隔开。
原文:http://www.planabc.net/2008/07/25/unitless-line-heights/
淘宝商城的detail页面“产物概况”部分是商家自界说区块,曾呈现如许一个成绩:

<styletype="text/CSS">
p{
line-height:17px;
}
</style>
<divclass="mdse-detail">
<p>
<strongstyle="font-size:30px">
品牌:XZX<br/>
市场价:145元<br/>
色彩:玄色<br/>
面料:棉<br/>
尺码:SML<br/>
衣长:S89M90L91<br/>
肩宽:S35M36L37<br/>
胸围:S88M92L96<br/>
下摆:S104M108L112<br/>
袖长:S17M17.5L18<br/>
因为丈量办法分歧,偏差在2CM摆布!
</strong>
</p>
</div>

你会发明下面例子的笔墨会堆叠在一同!这是甚么缘故原由呢?
因为.detail-content中的p元素承继了默许设置的全局款式line-height:17px,而自界说区块又是由商家自界说,其内字体被设置为了font-size:30px;(大概为恣意值),依据Inlineformattingmodel,得知该笔墨的line-box高为17px,多出的字体部分高低溢出,以是会呈现字体堆叠的征象。
那这个成绩怎样办理呢?
办理计划:我们给.mdse-detail下的p元素设定款式属性line-height:1.4。
为何办理计划里的1.4不带单元?
元素的line-height属性值会承继父元素(或先人元素)的line-height属性值,假如属性值有单元,则承继的值是换算后详细的px值而非原始的值(好比:em、%),而假如属性值没有单元,则扫瞄器会承继数值(无单元),然后依据该元素的font-size值从头剖析失掉新的line-height值。这个和table的tr设置display属性有一点点相似(tr.style.display=”;,IE显现block,而Firefox等尺度扫瞄器显现table-row)。
另有别的一个绝对低效的办法,但也不掉为一个快速的办理计划:
.mdse-detailp*{
line-height:140%;
}
参考浏览:《Unitlessline-heights》

层叠样式表(CascadingStyleSheets)的缩写,用于定义HTML元素的显示形式,是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。
变相怪杰 该用户已被删除
沙发
发表于 2015-1-18 05:30:23 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
金色的骷髅 该用户已被删除
板凳
发表于 2015-1-22 20:46:18 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
飘灵儿 该用户已被删除
地板
 楼主| 发表于 2015-1-31 14:24:38 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
柔情似水 该用户已被删除
5#
发表于 2015-2-6 20:13:55 | 只看该作者
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
海妖 该用户已被删除
6#
发表于 2015-2-18 13:18:10 | 只看该作者
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
冷月葬花魂 该用户已被删除
7#
发表于 2015-3-6 08:16:27 | 只看该作者
我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。
小妖女 该用户已被删除
8#
发表于 2015-3-12 23:55:58 | 只看该作者
还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。
莫相离 该用户已被删除
9#
发表于 2015-3-20 06:17:24 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-11-11 04:47

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表