文章分类 -  CSS

摘要：【伪元素选择器 】/* first-line 设置第一行*/p:first-line{ color: crimson;}/* first-letter 设置第一个字符*/p:first-letter{ color: green;}/* before 设置列表项之前的样式*/li:befo... 阅读全文

摘要：★ CSS实现圆角六色渐变自适应按钮详解（原理学习）http://www.zhangxinxu.com/wordpress/?p=377纯CSS3 半圆角 动感颜色http://www.oschina.net/question/5189_37133http://www.wangjie.org/css-code/detail-6405.aspx通过像素拼接出来的圆角http://demojava.iteye.com/blog/1560277CSS3 渐变 圆角（第二种方法）http://fengjiangtao.iteye.com/blog/1635123http://www.cnblogs.c 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。浮动浮动的框可以左右移动，直到它的外边缘碰到包含框或另一个浮动框的边缘。它不再处于文档流中，所以它不占据空间。当把框1向左浮动时，它脱离文档流并且向左移动，直到它的左边缘碰到包含框的左边缘，覆盖住了框2。如果把所有三个框都向左浮动，那么框1向左浮动直到碰到包含框，另外两个框向左浮动直到碰到前一个浮动框。如果包含块太窄，无法容纳水平排列的三个浮动元素，那么其他浮动块向下移动，直到有足够空间的地方。如果浮动元素的高度不同，那么当它们向下移动时可能会被其他浮动元素“卡住”。行框和清理浮动框旁边的行框被缩短，从而给浮动框留出空间，行框围绕浮动框。实际上，创建浮 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。相对定位通过设置垂直或水平位置，让这个元素“相对于”它的起点进行移动。#mybox { position relative; left: 20px; top: 20px;}在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其他框。绝对定位相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。与之相反，绝对定位使元素的位置与文档流无关，因此不占据空间。普通文档流中其他元素的布局就像绝对定位的元素不存在时一样。绝对定位的框与文档流无关，所以可以覆盖页面上的其他元... 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。空白边叠加当两个垂直空白边相遇时，它们将形成一个空白边。这个空白边的高度等于两个发生叠加的空白边的高度中的较大者。当一个元素包含在另一个元素中时（假设没有填充或边框将空白边分隔开），它们的顶和/或底空白边也发生叠加。空白边甚至可以与本身发生叠加。假设有一个空元素，它有空白边，但是没有边框或填充。在这种情况下，顶空白边与底空白边就碰到了一起，它们会发生叠加。如果这个空白边碰到另一个元素的空白边，它还会发生叠加。这就是一系列空的段落元素占用的空间非常小的原因，因为它们的所有空白边都叠加到一起，形成一个小的空白边。空白边叠加是有意义的。只有普通文档流中块框的 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。框模型概述页面上的每个元素被看做一个矩形框，这个框由元素的内容、填充、边框和空白边组成。如果在元素上添加背景，那么背景会应用于由内容和填充组成的区域。因此，常常使用填充在内容周围创建一个隔离带，使内容不会与背景混在一起。添加边框会在填充的区域外边加一条线，比如实线、虚线、点线。在边框外面的是透明的空白边，一般使用它控制元素之间的间隔。可以使用通用选择器去掉所有元素的间距和填充，覆盖浏览器样式。*{margin:0;padding:0;}在CSS中，width和height值的是内容区域的宽度和高度。添加填充、边框和空白边会增加元素框的总尺寸。填充、边框 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。第一章基础知识(X)HTML包含丰富的有意义的元素，比如strong、em、blockquote、cite、abbr、acronym、code、fieldset、legend、label、caption、thead等。HTML5参考手册：http://www.w3school.com.cn/html5/html5_reference.asp当存在意义合适的元素时，就应该使用它。分配ID和类名时，一定要尽可能保持名称有意义并与表现方式无关。比如命名subNav或secondaryNav比rightHandNav更好。比如错误消息以红色显示，也不要使用类名 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。有两个或更多规则寻找同一个元素，CSS通过一个称为层叠的过程处理这些冲突。层叠给每个规则分配一个重要度。！important规则body{ background:#000 !important; /*!important语法出现在声明中，位于属性值之后、结束声明的分号之前。*/} 包含！important规则的声明优先于其他任何声明，甚至是style属性。如果有多条！important规则，后一条规则优先。层叠采用以下重要度次序：1.标为！important的用户样式2.标为！important的作者样式3.作者样式4.用户样式5.浏览器/用户代理应. 阅读全文

摘要：学习CSS最好的方式之一是直接开始使用它。目录[-]类型选择器（元素选择器 或 简单选择器）分组后代选择器 （包含选择器）ID选择器类选择器避免“多类症”通用选择器子选择器相邻选择器属性选择器基于属性的存在与否进行选择基于属性值进行选择属性选择器Hack根据部分属性值选择属性子字符串选择器特定属性选择类型伪类锚伪类结构化伪类:lang 伪类伪元素：first-letter和:frist-line类型选择器（元素选择器或简单选择器）p{color:Black;}a{text-decoration:none;}分组结合选择器和声明的分组h1, h2, h3, h4, h5, h6 { color. 阅读全文

摘要：——摘自《精通CSS：高级Web标准解决方案》CSS注释以/*开头，以*/结束，这种注释称为C网格的注释。注释可单行，可多行，可出现在代码中的任何地方。/* Body Styles */body { font-size:67.5%; /* Set the font size */}1、添加结构性注释创建新的样式表时，在开头添加一个注释块，描述这个样式表的用途、创建日期或版本号、创建者等信息。/*--------------------------------------------------------------------Basic Style Sheet (for versio... 阅读全文