仓酷云

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

[DIV+CSS] 给大家带来CSS网页制造教程:表单button的行高

[复制链接]
活着的死人 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:11:04 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

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

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

x
那么什么是Div+CSS标准?Div+CSS的标准化设计到底有什么好处?
破洛洛文章简介:表单button的行高成绩。
HTMLCode
<inputtype="submit"id="button"value="engage"/>
CSSCode
#button{
border:2pxsolid#06f;
color:#06f;
background-color:#6cf;
font:bold12pxArial,Helvetica,sans-serif;
line-height:50px;
}
多最终效果中,分明的告知我们,在Firefox和Opera扫瞄器中都存在成绩,并且致命的一点是:“不管你经由过程甚么手腕往修正button的line-height,在Firefox和Opera扫瞄器下都无任何效果。”是甚么招致的呢?(我之前从没注重到他们有如许的一个bug存在)。看了下面的文章我才晓得,本来是扫瞄器对界说button的line-height是分歧的,我们来看看扫瞄器在Firefox下的剖析line-height值的截图:

从图中告知我们一个事理:button的行高在Chrome/Safari/IE8等扫瞄器剖析准确的line-height(用户自定的值“50px”);而在Firefox和Opera剖析的line-height倒是默许的值,只要“15px”。那为何会如许呢?
要回覆这个成绩,我回覆不出来,大概您晓得是为何?我只能把他看成是Firefox和Opera扫瞄器下的一个特性,换句话就是:这两个扫瞄器的line-height默许值为normal而且还加了一个“!important”,相似于:
button,input[type="reset"],input[type="button"],input[type="submit"]{
line-height:normal!important;
}
那我们是否是能够在设置值的时分也加个“!important”办理呢?我实验了,但是失利了,那我们必要怎样来办理呢?
怎样办理?
RobGlazebrook在他的《TheFirefoxInputButtonLine-HeightBug》教程中利用了一种办法——在button中不重置line-height的值,而是利用padding来制造不异的效果。如许下面的实例能够如许修正:
#button{
border:2pxsolid#06f;
color:#06f;
background-color:#6cf;
font:bold12pxArial,Helvetica,sans-serif;
padding:18px6px;
}

</p>
支持浏览器的向后兼容,也就是无论未来的浏览器大战,胜利的是IE7或者是火狐,您的网站都能很好的兼容。
沙发
发表于 2015-1-17 20:10:14 | 只看该作者
只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。
分手快乐 该用户已被删除
板凳
发表于 2015-1-17 20:10:14 | 只看该作者
由CS4版本开始,则转用WebKit排版引擎(亦即GoogleChrome和AppleSafari浏览器所用的排版引擎)作为网页预览。
山那边是海 该用户已被删除
地板
发表于 2015-1-31 21:49:33 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
再现理想 该用户已被删除
5#
发表于 2015-2-7 02:28:24 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
深爱那片海 该用户已被删除
6#
发表于 2015-2-20 04:32:24 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
变相怪杰 该用户已被删除
7#
发表于 2015-3-13 05:10:00 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
精灵巫婆 该用户已被删除
8#
发表于 2015-3-20 14:15:41 | 只看该作者
是当我和赵丽芬崔明艳老师进行交流后,很快就了解了还不太清楚的内容和并不了解的知识(像布局表格、绘制布局单元格等)。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2024-11-15 09:26

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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