郑州网建-前端开发

最近的文章列表

问题：默认样式下，div包裹img。div的高度会高于img的高度，这是什么原因呢？是浏览器就是这么渲染的，还是图片的某个样式属性的作用呢？除了通常设置图片display：block外，还有别的方法让div的高度自适应图片的高度吗？

代码图如下：

...

2013/6/24 Comments:CSS Html

效果图：

CSS代码：

...

2013/4/28 Comments:CSS CSS3 表格

兼容IE7+、Chrome、FireFox！

例子截图：

纯css的标签背景

HTML代码如下：

2013/4/24 Comments:CSS

这篇文章是根据目前 chrome 稳定版(19.0.1084.52 m)写的, 因为 google 也在不断完善chrome developer tool, 所以 chrome 版本不同可能稍有差别. 一些快捷键也是 windows 上的, mac 下的应该大同小异.

常规的断点相关的 breakpoint/conditional-breakpoint/call-stack/watch-expressions 等就不涉及了.

...

IE6对多个CSS样式的解析: 问题描述如果样式写成这样<p class="class_1 class_2">，那么在IE6和FF(IE6+同FF)下会显示为不同的效果。测试代码 ?1234567891011121314151617<html><head> <title>IE6对多个CSS样式的解析</title> <style type="text/css"> body { font-size:12px; } .West { color:Green; } .West.Color { color: Red; } </style></h; 2012/2/2 Comments:CSS

css选择器命名规则:差异及可能产生的问题: css选择器命名规则:差异及可能产生的问题,W3C CSS2.1的 4.1.3 节中提到：标识符（包括选择器中的元素名，类和ID）只能包含字符[a- zA-Z0-9]和ISO 10646字符编码U+00A1及以上，再加连字号（-）和下划线（_）；它们不能以数字，或一个连字号后跟数字为开头。它操作系统版本：Windows 7浏览器版本：IE6,IE7,IE8,Firefox 3.6.2,Safari 4.0.4,Chrome 5.0.356.2 dev受影响的浏览器：所有浏览器.经常讲到css选择器命名规则，其实不只是在团队合作基础上来讲这个，每个浏览器,IE产品，火狐，苹果，谷歌，都会因为命名不规范会产生不同样式..一、关于选择器的命名W3C CSS2.1的 4.1.3 节中提到：标识符; 2012/2/2 Comments:CSS IE6

CSS精灵图片(CSS sprite)使用心得: 提高网页显示速度最有效的一个方法是减少页面的HTTP请求次数，为了减少HTTP请求次数，最直接有效的方法是使用精灵图片（CSS sprites），精灵图片是把许多图片放到一张大图片里面，通过CSS来显示图片的一部分。本文的目的不是阐述精灵图片如何让网页下载更快，而是介绍在创建精灵图片时的一些实战经验。下面是一张精灵图片不要等你完成所有工作后再开始使用CSS精灵在网站全部完成后，你的CSS和图片也都已经创建好了，这时候你再使用CSS精灵，也就意味着你要返回重写CSS，并且还要把用到的一大堆图片再丢到Photoshop里拼合成一张图片，这是非常痛苦和乏味的。如果在刚开始构建页面时就着手使用CSS精灵，那么一切都会变得简单。按图片显示相反的方向放置图片这一条有点难以理解，我是在创建一张大的精灵图; 2011/9/25 Comments:CSS

关于CSS中@font-face 嵌入字体的用法客户端没有字体自动下载字体: font-family:的意思就是说，优先选择在前面的字体，比如微软雅黑，如果浏览者的电脑上没有安装这个字体，那么就采用Arial字体，以此类推，如果都没有，就使用最后一个sans-serif;也就是无衬线字体，这不是字体名，而是一类字体的称呼，雅黑近似地也属于sans-serif; 具体的你可以去找一下关于字体分类的知识。网页安全字体，也就是绝大多数系统中都有的字体大概有9种，没有的话就只能用近似的代替，还有一种@font-face，是CSS标记，可以下载服务器端字体，但问题比较多，有的浏览器不支持，而且下载速度很慢。另外还有用Flash实现的。 CSS手册中的介绍如下@font-face版本：CSS2 兼容性：IE4+ 语法： @font-face { font-family : na; 2011/6/21 Comments:CSS

CSS Sprites 样式生成工具 3.0(图片定位坐标): 这个可是我昨天无意间获得的，用了用还真是爽到家了呢，大家看了CSS Sprites是不是有些人会挠头不知道他是什么？不知道的话那这个工具你跟本是不会用到的呵呵。首先向大家先解释下什么是CSS Sprites：CSS Sprites是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言，不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需顾忌这个问题。按照yahoo的rules for high performance web sites的原则，应当较少Client与Server端间的HTTP Request次数。通过CSS Sprites方; 2011/6/20 Comments:CSS

JS中style属性: JS中style属性现在我需要对这个标签赋值，其内容为： 1、需要显示的字为HELLO WORLD； 2、span的 background-color : red ，另外还要：border:1px solid #333333;cursor:hand; 我需要在<script></script>内把他们赋值，请问怎么写呢？难道要： document.getElementById("a").style.background="red"; 来一项一项的写？能不能一下子把style写完啊，怎么写啊？解决办法：1、先定义一个CSS规则，然后this.className=’’2、document.getElementById("; 2011/5/23 Comments:JS Widget CSS