divcss,DIV+CSS布局体验总结 脚本之家推荐
点评：让你使用DIV+CSS排版 不是让你用换个标签然后再去按照表格的方式去排版 而是做到内容与表现的分离 1: ID用于标识页面单独元素以及持久行的结构性元素 方便JS的调用 类用于标识同一页面可重复定义使用的结构性元素 ID与类的命名需与表现形式无关 ：leftContent 而使用有意义的定义方式：sideBar等等。命名方式遵循“驼峰式大小写（标志符由多个单词组成 除首词首字母... [阅读全文]
divcss,让DIV块在页面的某个位置固定的css代码
点评：首先，我们将目光投向了CSS规范，我想很多人和我一样很快就想到了position属性，说到定位，我们很容易想到这个属性。 这个属性一共有四个选项：static、relative、absolute、fixed。很高兴，我们在阅读了相关的注释后，我们大概能看到fixed是比较符合我们的需求的： fixed: 位置被设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过... [阅读全文]
divcss,让DIV块在页面的某个位置固定的css代码
点评：首先，我们将目光投向了CSS规范，我想很多人和我一样很快就想到了position属性，说到定位，我们很容易想到这个属性。 这个属性一共有四个选项：static、relative、absolute、fixed。很高兴，我们在阅读了相关的注释后，我们大概能看到fixed是比较符合我们的需求的： fixed: 位置被设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过... [阅读全文]
htmlcss,Zen Coding 快速编写HTML/CSS代码的实现
在本文中我们将展示一种新的使用仿CSS选择器的语法来快速开发HTML和CSS的方法。它由Sergey Chikuyonok开发。 你在写HTML代码(包括所有标签、属性、引用、大括号等)上花费多少时间？如果你的编辑器有代码提示功能，你编写的时候就会容易些，但即便如此你还是要手动敲入很多代码。 在JavaScript方面，当我们想要在一个页面上获取某个特定的元素时，我们就会遇到同样的问题，我们必须写... [阅读全文]
coding,Zen Coding css，html缩写替换大观 快速写出html，css
阅读本文，先仔细阅读网站文章。 script type="text/javascript" src="/scripts/zen_settings.js"/script img img src="/12" alt="" / iframe iframe src="/12.html" frameborder="0"/iframe embed embed src="" type="" / object o... [阅读全文]
ie7ie8,2010全面兼容多浏览器IE6-IE7-IE8-FF的CSS HACK写法
点评：浏览器市场的混乱，给设计师造成很大的麻烦，设计的页面兼容完这个浏览器还得兼容那个浏览器，本来ie6跟ff之间的兼容是很容易解决的。加上个ie7会麻烦点，ie8的出现就更头疼了，原来hack ie7的方法又不能用了，怎么办呢？ 还好，微软提供了这样一个代码： meta http-equiv=”x-ua-compatible” content=”ie=7&Pr... [阅读全文]
火狐滚动条样式,FireFox火狐浏览器与IE兼容问题 - 透明滤镜 DIV滚动条
点评：IE与火狐浏览器兼容相关问题集锦，做网站的朋友可以参考下。 问题一：最简单的鼠标移过手变型的css要改了 cursor:pointer;/*FireFox（火狐）不支持cursor:hand*/ dw8下面自动出来的也没有hand这个属性了，标准的是pointer 问题二：FireFox（火狐）不支持滤镜 最常见的半透明不支持。 filter: Alpha(Opacity=50); /* f... [阅读全文]
教育方式小结,css的几种以图换字方式小结
点评：以图换字，其实是为了保证页面的可读性，这样既有利于搜索引擎，又有利于结构查看。由于这种方式被大多数人所认同，所以方法也越来越多 方法1：使用text-indent的负值，将内容移出容器 例如： 复制代码代码如下:h1 class="logo"a href="#"logo/a/h1 .logoa{display:block;text-indent:-999px;} 此方法（非常不推荐）看起来蛮... [阅读全文]
竖向滚动条定位,IE， firefox竖向横向滚动条处理
点评：IE一向是有竖向滚动条区域的，无论页面是否超过一屏，这回到了IE8竟然不是了。。。 Firefox在高度还不够一窗口的时候，本也没有scrollbar，但可以通过：html { overflow:-moz-scrollbars-vertical; }在IE8中怎么解决这个问题呢？答案是给html标签加上overflow-y:scroll;因此兼容Firefox和IE8的写法是：html { ... [阅读全文]
css中float left与float right的使用说明
点评：CSS中很多时候会用到浮动来布局，也就是经常见到的float:left或者float:right，简单点来说，前者是左浮动(往左侧向前边的非浮动元素飘，全是飘得元素的话，就按照流式来浮动从左到右，放不下则换行)，后者是右浮（往右飘）动。但仅仅是如此吗？ No! 要注意以下几点： 1、 浮动元素会被自动设置成块级元素，相当于给元素设置了display:block（块级元素能设置宽和高，而行内元... [阅读全文]
两个div并排,两个div并排的实现代码
点评：两个div并排的实现代码，一般在使用过程中，最好外面再包括一个用来定位居中显示。这里主要是了解下css的左右浮动布局给开始学习css的朋友。
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html x... [阅读全文]
教育方式小结,css的几种以图换字方式小结
点评：以图换字，其实是为了保证页面的可读性，这样既有利于搜索引擎，又有利于结构查看。由于这种方式被大多数人所认同，所以方法也越来越多 方法1：使用text-indent的负值，将内容移出容器 例如： 复制代码代码如下:h1 class="logo"a href="#"logo/a/h1 .logoa{display:block;text-indent:-999px;} 此方法（非常不推荐）看起来蛮... [阅读全文]
竖向滚动条定位,IE， firefox竖向横向滚动条处理
点评：IE一向是有竖向滚动条区域的，无论页面是否超过一屏，这回到了IE8竟然不是了。。。 Firefox在高度还不够一窗口的时候，本也没有scrollbar，但可以通过：html { overflow:-moz-scrollbars-vertical; }在IE8中怎么解决这个问题呢？答案是给html标签加上overflow-y:scroll;因此兼容Firefox和IE8的写法是：html { ... [阅读全文]
CSS Border高级使用实例分享（三角等形状）
点评：之前在懒懒分会上分享的一点关于border画小图的内容, 完整的ppt在这里. 原理 css盒模型 一个盒子包括: margin+border+padding+content – 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三角, 小梯形等. – 调整宽度大小可以调节三角形形状. 示例1 一般情况下, 我... [阅读全文]
css中float left与float right的使用说明
点评：CSS中很多时候会用到浮动来布局，也就是经常见到的float:left或者float:right，简单点来说，前者是左浮动(往左侧向前边的非浮动元素飘，全是飘得元素的话，就按照流式来浮动从左到右，放不下则换行)，后者是右浮（往右飘）动。但仅仅是如此吗？ No! 要注意以下几点： 1、 浮动元素会被自动设置成块级元素，相当于给元素设置了display:block（块级元素能设置宽和高，而行内元... [阅读全文]
泡泡对话框,纯CSS代码实现各类气球泡泡对话框效果
点评：利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。 一、关于纯CSS实现气泡对话框 首先，来张大图： 上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有... [阅读全文]
CSS Border高级使用实例分享（三角等形状）
点评：之前在懒懒分会上分享的一点关于border画小图的内容, 完整的ppt在这里. 原理 css盒模型 一个盒子包括: margin+border+padding+content – 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三角, 小梯形等. – 调整宽度大小可以调节三角形形状. 示例1 一般情况下, 我... [阅读全文]
泡泡对话框,纯CSS代码实现各类气球泡泡对话框效果
点评：利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。 一、关于纯CSS实现气泡对话框 首先，来张大图： 上边这张黄黄的，大大的，圆圆的，有个小尾巴，文字内容有些YY的图片，就是使用纯CSS实现的气泡对话框效果，一点图片都没有... [阅读全文]
css圆角,CSS border三角、圆角图形生成技术详解
点评：利用CSS的border属性可以生成一些图形，例如三角或是圆角。 一、前言 利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。我觉得此技术相当实用的，故本文再次简单叙述一下，另外，本文还将展示可能并不为众人所知的CSS b... [阅读全文]
div自适应高度,div模拟textarea文本域实现高度自适应效果代码
点评：textarea标签为表单元素，一般用在多行文字的输入。在web应用上常见的是评论输入框，微博信息输入框等。 一、关于textarea文本域以及高度自适应 textarea标签为表单元素，一般用在多行文字的输入。在web应用上常见的是评论输入框，微博信息输入框等。例如企鹅微博的输入框： 作为多行文本域功能来讲，textarea满足了我们大部分的需求。然而，textarea有一个不足就是不能像... [阅读全文]
css圆角,CSS border三角、圆角图形生成技术详解
点评：利用CSS的border属性可以生成一些图形，例如三角或是圆角。 一、前言 利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。我觉得此技术相当实用的，故本文再次简单叙述一下，另外，本文还将展示可能并不为众人所知的CSS b... [阅读全文]
css垂直居中,css实现的让图片垂直居中的方法
点评：图片的宽度和高度是未知的，没有一个固定的尺寸，在这个前提下要使图片在一个固定了宽度和高度的容器中垂直居中，想想感觉还是挺麻烦的，由于最近的项目可能会用到这个方案，所以把一些常用的方法都收集整理了一下。 下图是理想中的效果图，外部容器的宽度和高度是固定的，中间的图片宽度和高度未知，但是图片要始终要相对于外部的容器垂直居中。 但是实际中实现的效果并不是很完美，由于各浏览器的解析都各不相同，所... [阅读全文]
网页制作技巧,3个比较有用的网页制作技巧
点评：我们在进行DivCSS布局的时候，非常关注CSS技巧的学习，今天向大家推荐3个所谓的 “顶级”CSS技巧！虽然没有什么新意，但对新手而言却非常重要！ 一、在一行内声明CSS 复制代码代码如下:h2 {font-size:18px; border:1px solid blue; color:#000; background-color:#FFF;} h2 { font-size:18px; b... [阅读全文]
怀孕会不会头疼,让你写出更轻巧、更快并且更不会让你头疼的CSS的方法
点评：为什么我们的CSS变得一团糟——我们真的很容易陷入这样的困惑中。有时这是一开始就马虎编程的结果，有时是由于后期多重的附加代码（hacks)和修改造成的。 无论是哪种原因，这都不是无法避免的。写出干净，超级可管理的CSS很简单，只要你走对了路，你的代码会更便于今后的维护和编辑。 写出更轻巧、更快并且更不会让你头疼的CSS，以下这10个技巧将会提高你这方面的能力。 1.保持条理性 像任何事情一... [阅读全文]
css垂直居中,css实现的让图片垂直居中的方法
点评：图片的宽度和高度是未知的，没有一个固定的尺寸，在这个前提下要使图片在一个固定了宽度和高度的容器中垂直居中，想想感觉还是挺麻烦的，由于最近的项目可能会用到这个方案，所以把一些常用的方法都收集整理了一下。 下图是理想中的效果图，外部容器的宽度和高度是固定的，中间的图片宽度和高度未知，但是图片要始终要相对于外部的容器垂直居中。 但是实际中实现的效果并不是很完美，由于各浏览器的解析都各不相同，所... [阅读全文]
网页制作技巧,3个比较有用的网页制作技巧
点评：我们在进行DivCSS布局的时候，非常关注CSS技巧的学习，今天向大家推荐3个所谓的 “顶级”CSS技巧！虽然没有什么新意，但对新手而言却非常重要！ 一、在一行内声明CSS 复制代码代码如下:h2 {font-size:18px; border:1px solid blue; color:#000; background-color:#FFF;} h2 { font-size:18px; b... [阅读全文]
css3圆角,利用CSS3的checked伪类实现OL的隐藏显示的方法
点评：随着CSS3的发布，国外研究正如火如荼，但在国内还有很多人抱着IE不支持CSS3的想法，始终无动于衷不肯去学习。 随着CSS3的发布，国外研究正如火如荼，但在国内还有很多人抱着IE不支持CSS3的想法，始终无动于衷不肯去学习。但是历史告诉我们，好的东西必将盛行，CSS3也终将也会替代CSS2，下面就和大家分享一个用CSS3打造的可折叠树状菜单。 直接上图: 树状菜单相信大家都不会陌生，我们... [阅读全文]
怀孕会不会头疼,让你写出更轻巧、更快并且更不会让你头疼的CSS的方法
点评：为什么我们的CSS变得一团糟——我们真的很容易陷入这样的困惑中。有时这是一开始就马虎编程的结果，有时是由于后期多重的附加代码（hacks)和修改造成的。 无论是哪种原因，这都不是无法避免的。写出干净，超级可管理的CSS很简单，只要你走对了路，你的代码会更便于今后的维护和编辑。 写出更轻巧、更快并且更不会让你头疼的CSS，以下这10个技巧将会提高你这方面的能力。 1.保持条理性 像任何事情一... [阅读全文]
css3圆角,利用CSS3的checked伪类实现OL的隐藏显示的方法
点评：随着CSS3的发布，国外研究正如火如荼，但在国内还有很多人抱着IE不支持CSS3的想法，始终无动于衷不肯去学习。 随着CSS3的发布，国外研究正如火如荼，但在国内还有很多人抱着IE不支持CSS3的想法，始终无动于衷不肯去学习。但是历史告诉我们，好的东西必将盛行，CSS3也终将也会替代CSS2，下面就和大家分享一个用CSS3打造的可折叠树状菜单。 直接上图: 树状菜单相信大家都不会陌生，我们... [阅读全文]
css滑动菜单,纯CSS实现的滑动的可折叠菜单
点评：纯CSS实现的二级纵向下拉菜单，可以滑动折叠，无需JavaScript代码，兼容性好
!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... [阅读全文]
