摘要：overflow属性 1.如果将overflow属性值设定为hidden，则超出容纳范围的文字将被隐藏起来。 div{ overflow:hidden; } 2.如果将overflow属性值设定为scroll，则div元素中将出现固定的水平滚动条与垂直滚动条，文字超出div元素的容纳范围时将被滚动显
阅读全文
摘要：div{ word-wrap:break-word; } word-wrap属性可以使用的属性值为normal与break-word两个。使用normal属性值时浏览器默认处理，只在半角空格或者连字符的地方进行换行。使用break-word时浏览器可在长单词或URL地址内部进行换行。 目前，word
阅读全文
摘要：1.依靠浏览器让文本自动换行 浏览器本身都自带着让文本自动换行的功能。 2.指定自动换行的处理方法 在CSS3中，可以使用word-break属性来自己决定自动换行的处理方法。 div{ word-break:break-all; } 当word-break属性使用break-all参数值时，对于西
阅读全文
摘要：首先可以使用before选择器与after选择器的content属性在元素的前面或者后面插入文字和图像，这里我记录的是利用这个content属性来在项目前插入项目编号，同时可以利用content属性在字符串两边加上括号。 1.在多个标题前加上连续编号 <style type="text/css">
阅读全文
摘要：<body> <style type="text/css"> //只对li1设置样式 li:nth-child(1):nth-last-child(1){ background:yellow; } </style> <h2>列表1</h2> <ul> <li>li1</li> </ul> <h2>列
阅读全文
摘要：1.使用nth-child和nth-last-child时会产生的问题 在使用nth-child和nth-last-child时，其计算子元素是奇数个元素还是第偶数个元素时，是连同父元素中的所有子元素一起计算的。 当父元素是列表时，列表中只可能有列表项目一种子元素，所以不会出问题，但是当父元素是di
阅读全文
摘要：1.单独指定第一个子元素、最后一个子元素的样式 <style type="text/css"> li:first-child{ background:yellow; } li:last-child{ background:blue; } </style> 2.对指定序号的子元素使用样式 <style
阅读全文
摘要：1.root选择器 将样式绑定到页面的根元素中。根元素是指位于文档树中最顶层结构的元素，在HTML页面中就是指包含整个页面的<html>部分。 <style type="text/css"> :root{ background:yellow; } body{ background:green; }
阅读全文
摘要：1.伪类选择器 在CSS中，最常用的伪类选择器是使用在a（锚）元素上的几种选择器，它们的使用方法如下： a:link{color:#FF0000;text-decoration:none} a:visited{color:#FF0000;text-decoration:none} a:hover{c
阅读全文
摘要：<div id="section1"> 示例文本1</div> <div id="subsection1-1">示例文本1-1</div> <div id="subsection1-2">示例文本1-2</div> <div id="section2">示例文本2</div> <div id="su
阅读全文
摘要：text-shadow是给文本添加阴影效果，box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及，这一特殊效果使用越来越普遍。 基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor
阅读全文
摘要：box-sizing属性可以为三个值之一：content-box（default），border-box，padding-box。 content-box，border和padding不计算入width之内 padding-box，padding计算入width内 border-box，border
阅读全文
摘要：一. Webkit浏览器 (1) 第一种写法： background:-webkit-gradient(linear ,10% 10%，100% 100%， color-stop(0.14,rgb(255,0,0)), color-stop(0.5,rgb(255,255,0)), color-st
阅读全文
摘要：今天做东西，遇到了这个问题，百度后总结得到了这个结果。 首先，要知道css的三条属性。 overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行 这三个是css的基础属性，需要记
阅读全文
摘要：CSS样式中不是全部的属性都是可以被子元素继承的，下面列出 CSS中可以和不可以继承的属性。 不可继承的： display、margin、border、padding、background、height、min-height、max- height、width、min-width、max-width
阅读全文
摘要：CSS2.0 HandBook上的解释： 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局。假如其他具有不同 z-index 属性的对象已经占据了给定的位置，他们之间不会相互影响，而会在同一位置层叠。 TRBL属性（TOP、RIGHT、BOTTOM、LE
阅读全文
摘要：position：absolute 参考谁进行定位的问题。之前大家可能会认为如果absolute元素的父级（祖父）元素没有设置position属性的时候，该元素的position：absolute会参考body进行定位。 换句话说是如果父级设置了position（且值为非static），参照（最近的
阅读全文
摘要：前几天做个邮箱系统，其中在内容的div设置了高度为200px; 可是在内容大于200高度后就出现了内容的溢出。 如图： 查完资料够才知道css有个min-height; 设置div的初始化高度，设置属性就适应内容的高度。 如图： ok了。
阅读全文
摘要：一、border-image的兼容性 border-image可以说是CSS3中的一员大将，将来一定会大放光彩，其应用潜力真的是非常的惊人。可惜目前支持的浏览器有限，仅Firefox3.5，chrome浏览器，Safari3+支持border-image。所以，就本文而言，IE浏览器可以回家休息了，
阅读全文
摘要：弹性盒布局模型（Flexible Box Layout）是 CSS3 规范中提出的一种新的布局方式。该布局模型的目的是提供一种更加高效的方式来对容器中的条目进行布局、对齐和分配空间。这种布局方式在条目尺寸未知或动态时也能工作。这种布局方式已经被主流浏览器所支持，可以在 Web 应用开发中使用。本文详
阅读全文
浙公网安备 33010602011771号
