51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
WOT技术大会
IT证书
公众号矩阵
移动端
短视频 免费课程 课程排行 直播课 软考学堂
全部课程 厂商认证 IT技术 24年11月软考 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
# css

IE10浏览器的hack解决方法

标签：<div style="width:735px; height:405px;"> <div class="mainFloat"></div></div>样式：.mainFloat {width:725px;height:395px;border:#78a5c2 solid 5px;padding:0;overflow-y:hidden;ove

IE10 hack   兼容性
原创 2013-09-26 16:36:45 840 阅读

给商品评分效果，CSS技巧

像这种给商品评分的效果，基本上所有电商网站都有。这里写这个效果的时候运用到了一些CSS技巧。结合posiiton,z-index,background-p_w_picpath,background-position,overflow,:hover等等多个属性。<li class="pro_rating"> 给商品评分：

给商品评分效果
CSS技巧
原创 2013-09-03 16:43:11 535 阅读 1点赞

CSS的content属性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

CSS content属性
原创 2013-08-23 16:03:45 678 阅读

CSS的新表格布局方式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

css
table
display
table-cell
table-row
CSS新表格布局
原创 2013-08-23 14:13:24 916 阅读

IE9 下hack的写法及IEhack写法汇总

margin-top:4px\9;position:absolute\9;老是看到以上CSS代码的写法，甚不明白，现在终于明白了，原来是IE9的hack，专门针对IE9设置的样式，只有IE9可以解析这样的样式。/* CSS属性级Hack */ color:red; /* 所有浏览器可识别*/ _color:red; /* 仅IE6 识别 */ *color:red; /* IE6、IE7 识别 *

IE9 hack
原创 2013-08-02 16:17:49 1892 阅读 1点赞

png图片IE6下实现透明

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

png图片IE6下透明
原创 2013-07-18 16:11:08 592 阅读 1点赞 3评论

display:list-item，不需要有ul,ol,li等列表标签也能排布列表格局

给一个元素两个属性，就能让这些元素按照列表排列。这两个属性是：1、display:list-item2、list-style-type:decimal(属性值很多种类)；

列表
display:list-item
sist-style-type
原创 2013-07-10 15:33:15 4588 阅读

margin:0 auto 在火狐浏览器下的兼容性

<div class="parents" style="overflow:hidden">    <div class="kids" style="width:980px; height:auto; margin:0 auto; overflow:hidden;"></

overflow:hidden兼容火狐
原创 2013-07-09 17:28:42 698 阅读 1点赞

a 伪类在IE6下优先级大于class

结构：<a href="#" class="white">首 页</a>样式一：a:link,a:visited{ font-size:12px; color:#666; text-decoration:none; } a:hover{ color:#039; } a.white{ color:#fff;

兼容性
IE6
a链接
伪类
原创 2013-06-26 11:08:10 388 阅读

z-index属性在IE6和IE7中的bug,和position属性的冲突

z-index属性和position属性凑在一起，在IE6和IE7下会出现问题，这个bug你要是不知道解决方法，真的很难解决。解决的办法就是，子级和父级同时都设定一个z-index值，一直到父级的父级的父级，一次类推，不然这个子级总是会被父级的同级其他元素给挡住。<div id="header">    <div id="nav&

IE7
兼容
IE6
z-index
position
原创 2013-06-14 11:12:46 1266 阅读

overflow属性在IE7和IE6上的兼容性

overflow：hidden属性被称为“CSS万能属性”，今天我深刻的感觉到了，虽然是万能属性，但是不是全能的，也是不能乱用的属性。今天，我的页面在IE6和IE7里出现了这样的bug，页面部分用了定位的元素会跟着滚动条滚动。而且会出现两条滚动条。我今天查了一天，也没查出是什么原因。最后终于让我发现了，原来是设置了一下元素：body{overflow-x:auto; overflow-y:auto

ie7
ie6
css
overflow：hidden
overflow-x
overflow-y
原创 2013-06-09 19:42:14 679 阅读

visibility:hidden 和 display:none 的区别

display:none估计大家再熟悉不过了，呵呵，至少我是再熟悉不过了。经常用到的CSS属性。对于visibility:hidden 不一定每个会写CSS的人都了解。幸好，我今天了解了。特跟大家分享一下。display:none 和 visibility:hidden 的共同点都是让这两个元素隐藏起来。但是display:none是完全隐藏，不占据空间了，而visibility:hidden虽然

visibility:hidden
display:none
CSS
原创 2013-06-08 13:23:29 587 阅读

让IE6兼容position:fixed

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

bug
ie6
position:fixed
原创 2013-06-06 17:22:02 1615 阅读

让div的背景图片适应各种显示屏的分辨率

平时我们做网站都是980或者960或者1000等的布局，版心很少有超过1000.我现在做的网站版心为1040，因为在1024的分辨率下会出现问题。现在就背景图问题跟大家分享一下。一般网站我们都会把需要全屏的背景图给body,这样很容易让它适应各个浏览器和各个显示屏的分辨率。当网站的背景图不是一整张的时候，head或者content部分一个背景图，而bottom部分一个背景图，而中间内容部分高度需要

背景图全屏兼容性
原创 2013-06-05 16:54:17 1708 阅读 1点赞 1评论

CSS里 !important 属性的用法

!important是CSS1就定义的语法，作用是提高指定样式规则的应用优先权。语法格式{ cssRule !important }，即写在定义的最后面，例如：box{color:red !important;}ie7,ie8,firefox,chrome等高端浏览器下，已经可以识别 !important属性， 但是IE 6.0仍然不能完全识别，汗! important的样式属性和覆盖它的样式属性

CSS
!important
兼容IE6
原创 2013-06-05 16:32:21 2224 阅读

min-height,min-width等兼容IE6

min-width max-width这两个属性在ie6中是不支持的。这里介绍一些兼容解决方法。使用expression属性（CSS表达式这个方法会让浏览器的访问速度变慢，尽量少用）最小宽度500px：.min { width: expression(document.body.clientWidth < 500? "500px" : "auto"); }最大宽度500px：.max {

CSS
IE6
min-height
min-width
兼容IE6
原创 2013-06-05 16:24:46 1013 阅读

input[type=text]样式应该注意的地方

方法一：.login dl dd input{ width:164px; height:20px; line-height:20px; padding:3px 0; border:1px solid #d8d8d8; }以上是一个登陆时填写用户名的input例子，样式中书写时应该同时用到line-height,padding值，来控制他的行高，以及在文字在输

CSS
input
原创 2013-06-03 16:14:45 1056 阅读

用CSS绘制三角形和箭头

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <me

CSS
用CSS绘制三角形
箭头
转载 精选 2013-05-24 11:32:28 1095 阅读

CSS判断浏览器方法整理

Update: http://browserhacks.com/，最全的 hack 方法整理。整理几个常用的判断浏览器的方法，记录在这里方便查阅。不算全面，以后遇到问题了再来更新。Conditional Comments<!--[if IE]>  According to the conditional comment this is IE<![endif]-->

CSS
hack
判断浏览器
转载 精选 2013-05-22 17:10:20 658 阅读

清除浮动的方法

目前我用到过几个清除浮动的方法：1、直接用clear属性。比如：clear:both;2、给个空的div.3、用定位取代浮动4、就是用伪类，通过 :after 在元素后面添加一块区域，然后将其隐藏，可以弥补 overflow: hidden; 的缺陷。如：.clearfix:after{    content:"";    display

float
position
CSS属性
清除浮动
overflow:hidden
原创 2013-05-22 16:39:27 353 阅读

牢记31种CSS选择器

原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2011 年 6 月，介绍了 30 种最常用的 CSS 选择器用法，多加了一种，变成了牢记 31 种选择器用法。其他 CSS3 选择器用法请查看 CSS3 selectors explained 这篇文章，此外，W3C CSS3 选择器官方文档 Selectors Level 3

CSS
CSS3
CSS选择器
CSS1
CSS2
转载 精选 2013-05-22 16:34:17 403 阅读

CSS性能

转载与http://peters-playground.com/2013/04/css-performance-2/ CSS性能一：如何写 CSS 令浏览器的执行效率最高呢？翻译一篇 Chris Coyier 的 Efficiently Rendering CSS 帮助理清思路。此外，Google 也有一篇更详细的讲解文章 Optimize browser rendering。第一，浏览器读 CS

CSS
CSS性能
转载 精选 2013-05-22 15:54:28 324 阅读

CSS字体样式的缩写

正常情况下，字体样式的缩写是这样的:font:font-style font-variant font-weight font-size line-height font-family;font-style是字体样式，斜体（italic）、倾斜体(oblique)、正常(normal)、继承(inherit)font-variant是字体变体，normal、small-caps、inherit其他

CSS
缩写
字体样式
原创 2013-05-21 12:02:18 759 阅读

dreamweaver格式化CSS代码

 今天发现dreamweaver里能格式化CSS代码，这样代码就不会那么乱了，应为在网站改版时，发现原来的CSS代码大小写很不一致，格式化和缩进也不一致。用dreamweaver格式化方便多了。   格式化CSS： 第一步：在编辑--首选参数--代码格式--选择CSS按钮--设置自己喜欢的CSS代码格式 第二步：点击命令--应用源格式   大小写转换：

dreamweaver
格式化代码
原创 2013-05-07 13:57:14 1097 阅读

用CSS设置字体颜色在火狐，IE6，IE7下不同

<style type="text/css">         #box{             color:#f00; &n

html
css
兼容性
字体颜色
hack方法
！important属性
原创 2013-04-19 21:47:02 726 阅读

Copyright © 2005-2024 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯