随笔分类 - CSS
摘要：今天在css-tricks上看到一篇文章，那篇文章让我不禁心头一震，强大的CSS啊，居然能画出这么多基本的图形。图形包括基本的矩形、圆形、椭圆、三角形、多边形，也包括稍微复杂一点的爱心、钻石、阴阳八卦等。当然有一些需要用到CSS3的属性，所以在你打开这篇文章的时候，我希望你用的是firefox或者chrome，当然IE也能看一部分的。那好，下面就一起来看看我们是如何用纯CSS来画这些图形的，如果你也觉得很震撼，推荐给你的朋友吧。1、正方形最终效果：CSS代码如下：1 #square {2 width: 100px;3 height: 100px;4 backgrou...
阅读全文
摘要：方案一：<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title>Demo</title> <style type="text/css"> #outer{ width:500px; height:200px; margin: 50px auto; border:1px solid #CCC; display:table; text-align:center; ...
阅读全文
摘要：这是最近碰到的几个题目，简单地写一下我自己的方案，在此分享给大家，也希望能看到大家的方案。 水平有限，不保证我的方案绝对正确，如有错误欢迎指出。一、自己实现string的substring方法方法一：用charAt取出截取部分String.prototype.mysubstring=function(beginIndex,endIndex){ var str=this, newArr=[]; if(!endIndex){ endIndex=str.length; } for(var i=beginIndex;i<endIndex;i++...
阅读全文
摘要：本文转载自:http://www.topcss.org/?p=94，有修改。 负数给人总是一种消极、否定、拒绝之感，不过有时利用负margin可以达到奇妙的效果，今天就表一表负值在页面布局中的应用。这里说的负值主要指的是负margin。 关于负margin的原理建议大家看看这篇文章：http://www.cnblogs.com/2050/archive/2012/08/13/2636467.html#2457812 本文不讲原理，主要展示几个应用。一、左右列固定，中间列自适应布局 此例适用于左右栏宽度固定，中间栏宽度自适应的布局。由于网页的主体部分一般在中间，很多网页都需要中间列优...
阅读全文
摘要：以下内容参考资源：http://www.w3.org/TR/css3-selectors/#selectors属性选择器新增选择器列表： E[foo^="bar"]：匹配foo属性值以"bar"开始的E元素 E[foo$="bar"]：匹配foo属性值以"bar"结束的E元素 E[foo*="bar"]：匹配foo属性值包含"bar"的E元素 这几个选择器很简单，其实在jQuery的选择器中早就包含了，所以就不多说了。浏览器兼容性：IE 6IE 7IE 8IE 9Chrome
阅读全文
摘要：Doctype是什么？如何触发严格模式与混杂模式模式？区分它们有何意义？ Doctype是document type（文档类型）的简写，是用来说明所用的XHTML或HTML是什么版本的。XHTML1.0 提供了三种DTD声明可供选择，分别是： 1、过渡的(Transitional，也叫混杂模式)：要求比较宽松，允许继续使用HTML4.01的标识，完整声明为<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
阅读全文
