分类： 网页制作
CSS技巧：背景混合模式制作高级效果
前端开发是否对设计师用的 Photoshop 中的图层混合模式一点办法都没有，然后现在我们可以通过 CSS 来实现网页中的图片混合了。
一、前言
如果「一图胜千言」……
css3绘制腾讯企鹅算什么？姐给你画个百度熊〜
用css3绘制腾讯企鹅，算什么厉害。趁着今天有空，姐就用css3来写一个百度的小度熊。话不多说，开始上码。
爆照
先来一张呆萌小度熊的成果照。
在绘制小度熊……
HTML5 video视频字幕的使用和制作
原生HTML5 video对字幕的支持显示情况:
元素
HTML5允许我们使用元素为视频指定字幕。这个元素的各种属性允许我们指定这样的东西，比如我们添加的内容的类型……
css实现底部元素“粘住底部”效果的方案与代码
如何用css来实现底部元素可“粘住底部”的效果，对于“粘住底部”，本文有两种理解：
一是无论内容的多少，我们都希望使按钮，固定于可视窗口的底部，且内容区是……
div文字超出使用css限制宽度，用省略号...
做前端的时候总是遇到文字超出的问题，那么可以使用div可以限制宽度，超出部分用省略号
<style>
div.wid{
width:200px;
white-space:nowrap……
CSS布局学习技巧全面指南
如翻天覆地的前端开发一般，CSS布局也产生了巨大的变化。现在我们有需要可选的CSS布局方式来开发我们的网站，这也就要求我们对这些方式作出选择。在这片文章……
CSS技巧：display:none与visibility:hidden的恩怨情仇
面试时被问起"请说说display:none和visibility:hidden的区别"吗？是不是回答完display:none不占用原来的位置，而visibility:hidden保留原来的位置后，面试官……
CSS3 filter 属性 制作酷炫的果冻菜单
这里我要学（抄）习（袭）的就是这个菜单效果，这个 dom 结构还是很简单的。
div.blobs
div.circle.main
div.circle.sub.first
div.circle.su……
bootstrap-select 多选+模糊查询下拉框（官方示例文档详解）
实际开发中遇到了一个问题，就是需要既支持多选又同时支持模糊查询的下拉控件，大家所熟知的比较强大的下拉框插件bootstrap-select2，博主当时也参考过，但……
CSS3新增多栏布局（Multi-Columns Layout）低调却不简单
一、明确结构
多栏布局的结构很简单，主要由multi-column container和column box组成。
当一个元素设置了column-width和column-count属性并且值不为auto，那……
CSS滤镜:filter改变图片颜色多种方法：核心是filter:url()
强大的 CSS:filter
CSS滤镜（filter）属提供的图形特效，像模糊，锐化或元素变色。过滤器通常被用于调整图片，背景和边界的渲染。
CSS标准里包含了一些已实……
HTML5 做网页 一些重要但不常见的语义标签有哪些？
使用 HTML5 做网页了，并且会使用一些常见的标签，如 <header>、<section>、<article> 和 <footer> 等等，除此之外，还有一些不常……
CSS水平垂直居中10种实现方式代码大全
要实现上图的效果看似很简单，实则暗藏玄机，本文总结了一下CSS实现水平垂直居中的方式大概有下面这些，本文将逐一介绍一下，我将本文整理成了一个github仓……
CSS层叠上下文、层叠等级、层叠顺序、z-index一文搞懂
以往，由于自己使用z-index的频率不大，所以对这个CSS属性存在比较片面的认识。一直认为z-index就是用来描述定义一个元素在屏幕Z轴上的堆叠顺序。z-index值……
css float属性总结 不足之处由BFC来终结
1. float介绍
CSS世界中的float属性是一个年代非常久远的属性，设置了float属性的元素会根据设置的属性值向左或者向右浮动，直到它的外边缘碰到包含框或另一个……
css布局之absolute定位属性应用技巧总结
2. absolute的特性
在介绍absolute之前，有以下公共CSS代码：
/* CSS代码 */
.father{
border: 2px solid deeppink;
width: 200px;
}
.son {
……
css进阶：:last-child 与: last-of-type 的区别
做列表的时候，会经常遇到最后一个元素与其他元素在样式上会有差异的情况。
如果是单纯的静态页面，可以使用class去控制。也可以在页面渲染结束之后，使用js去……
css重点：Flex弹性布局的属性及使用
网页布局是CSS的一个重点
传统的布局解决方案，是基于盒装模型，主要依赖的属性有：
normal flow（文档流）
float + clear
position relative + absolute……
CSS中写的%都是相对于谁进行计算的呢？
0.引言
在我们编写CSS的时候，经常会用到百分比赋值（%）实现自适应。像我们最常使用的流式布局设计模式，基本所有的column的宽度都是通过%来取值的。或者比……
CSS3属性总结之background
学习css3的一些新属性，就把一些使用中遇到的方法和问题做一个小结。
background-color
背景颜色在IE7之前只显示到padding区域，不包含border。而现代浏览器……
img标签的alt与title有何异同？src与href的区别是什么？
alt(alt text) ： 为不能显示图像、窗体或applets的用户代理，alt属性用来指定替换文字，替换文字的语言由lang属性指定。
title(tool tip) ：设置该属性的元素……
px/em/rem的区别有哪些？
1、px值固定，容易计算
2、em的值并不是固定的；
3、em会继承父级元素的字体大小。使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这……
CSS Hack是什么？ie6,7,8的hack分别有哪些？
针对不同的浏览器写不同的css code的过程就是css hack，比如
#text {
background-color:yellow /*ie8*/
+background-color:yellow /*ie7*/
_backg……
css水平垂直居中有哪些，写出代码？
1.已知固定宽高元素
.parent {
position: relative;
}
.child {
width: 300px;
height: 100px;
padding: 20px;
position: absolu……