没有找到合适的产品?
联系客服协助选型:023-68661681
提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
转帖|其它|编辑:郝浩|2009-03-13 17:15:13.000|阅读 709 次
概述:成为高手必须学会的15个CSS技巧
# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>
把一个绝对定位的元素放在一个相对定位元素中,会使绝对定位的元素的位置相对于最近的已定位祖先元素。这是一个很好的技术,用来将元素定位在需要的位置,例如,顶部logo。
z-index可能对一些开发者来说比较神秘,通常,你会发现设计师设定一个非常大的z-index数值给div元素或element元素,用来将 它置于另一个元素上面;我们需要记住的是,z-index只适用于有position值的元素。如果你发现一个元素z-index值无效,需要给这个 div加上position:relative或者position:absolute。
给margin值设为auto;是一个使元素居中而不用担心用户屏幕大小的好方法;然而,“margin: auto”只有具有宽度值的元素起作用;这意味着使用“margin: auto”的行内元素,首先设定display:block。
当刚开始学CSS用padding时的一个常犯的错误是不知道所有的盒模型效果,记住根据盒模型的定义;padding的数值会加到元素宽度属性的上面,这将引很多麻烦和元素偏移,例如:
1 |
#div { |
总宽度等于264px ( 200 + 30 + 30 + 2 + 2 ) 。 此外,请记住padding不像margin,不能设为负值。
假如你有一张网站的logo图片,这个图片在h1 标记中。为了SEO,于是我们将文字鞋到h1标记中,方便搜索引擎阅读,但并不要文字显示,有的人可能会使用 “display:none” 将元素隐藏,那么就不得不吧logo图片放在别的标记中,我们使用为 text-indent设定负值, 也能达到这个效果.
1 |
h1 { |
敢肯定,大家都处理过这个问题,因为这是一个我们最常用的CSS “hack”。如果你以前没有看到过这个BUG,那么看下发生条件:一个浮动元素如果设置margin和浮动元素的方向相同时,在IE 6中margin显示值会是设定值的2倍! 幸运的是,修补这个BUG程序很简单。 我们给浮动元素加入display: inline;看下面例子:
1 |
.yourClass { |
表单的写法如下:
1 |
<label for="”Name”">姓名:</label> |
使用css为id为captcha的input元素设定图片背景;这将使垃圾邮件脚本找到你的html元素 ,扫描你的CSS ,比较选择器,找到某些背景图像,然后读取此背景图片。可以有效防止邮件。 缺点是,如果有人不上网启用CSS。
我确信大家都同意的是,在IE6中使用PNG图片很头疼,可以使用复杂的Javascript技术和微软的滤镜属性,或者用就 .jpg格式. 使用微软AlphaImageLoader :
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=sURL.png)
跨浏览器使用CSS透明效果很简单。 我们可以将效果遍布 Firefox和Safari、Opera、旧的浏览器如Netscape Navigator中。
1 |
.yourClass { |
CSS图片sprites是一个同时加载多个CSS图像的好方法,此外它可以减少HTTP请求和主题文件的大小。 此外,还可以消除hover图片“闪烁”。CSS图片sprites把许多图片都合并为一个图片文件。 然后,我们使用CSS来调整背景图片的定位值、宽度、高度,将图片放在我们想要的地方。
通常, Web开发人员被加入新的CSS规则和声明,只适用于某些版本的IE浏览器。 如果您不熟悉条件注释,下面的代码是当用户的浏览器是小于或等于IE 7 时链接样式表::
1 |
<!--[if lte IE 7]> |
将代码放在你的HTML文件head标记中。 如果不是在IE浏览器将不会链接样式表,如果是链接CSS文件将覆盖默认的样式。
CSS样式的特殊性的值,决定样式优先级的高低。
元素为:1
类选择符为:10
ID选择符为:100
行内样式为:1000
在开发时,我们经常要实现的效果是,让元素至少有一定的高度,然后如果需要的话伸展以容纳更多的内容。 不幸的是, IE浏览器不能正确使用min-height属性。 幸运的是,有个min-height fast hack ,这是这样做:
1 |
#yourId { |
如果您需要或希望使用特定的样式,可以使用* HTML hack 。 在一个符合标准的浏览器中, HTML元素将永远是根元素,因此在HTML之前用*不被识别。 然而, IE浏览器中这是完全合法的。 因此,如果我们要在IE中使用某些样式,我们可以这样做:
1 |
* html body div#sideBar { |
在导航按钮中使用背景图片,问题是按钮的文本太长超出图片,或者被截断。 使用两个图片和的CSS滑动门技术 ,我们可以创建按钮通过扩大以适应内的文字。 这种技术是每个按钮用两张图片,并用CSS定义背景图片。 例如:
HTML:
1 |
<a class="myButton"><span>标题</span></a> |
CSS:
1 |
a.myButton { |
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@evget.com
文章转载自:themeforest面对“数字中国”建设和中国制造2025战略实施的机遇期,中车信息公司紧跟时代的步伐,以“集约化、专业化、标准化、精益化、一体化、平台化”为工作目标,大力推进信息服务、工业软件等核心产品及业务的发展。在慧都3D解决方案的实施下,清软英泰建成了多模型来源的综合轻量化显示平台、实现文件不失真的百倍压缩比、针对模型中的大模型文件,在展示平台上进行流畅展示,提升工作效率,优化了使用体验。
本站的模型资源均免费下载,登录后即可下载。模型仅供学习交流,勿做商业用途。
本站的模型资源均免费下载,登录后即可下载。模型仅供学习交流,勿做商业用途。
本站的模型资源均免费下载,登录后即可下载。模型仅供学习交流,勿做商业用途。
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@evget.com
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢
慧都科技 版权所有 Copyright 2003-
2025 渝ICP备12000582号-13 渝公网安备
50010702500608号