Skip to content

{ Category Archives } CSS

前端扩展插件

模拟数据

Easy Mock
野狗

JavaScript 交互

waypoints 滚动到某元素触发某事件

JavaScript UI工具

autosize 自动调整textarea输入框大小
clipboardjs 剪切板
jQuery custom content scroller 滚[……]

Read more

Flex布局

2009年,W3C 提出了一种新的方案 Flex 布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。

浏览器支持:IE10 F22 C21 O12.1 S6.1

教程参考:
Flex 布局教程:语法篇 – 阮一峰
-[……]

Read more

CSS3的一些新奇属性和用法

1 clip

2 渐变 IE10+
background:linear-gradient(45deg,#fff,#fff);
radial-gradient

3 混合模式 mix-blend-mode/background-blend-mode[……]

Read more

CSS伪类、CSS伪元素详解

定义

 
CSS伪类 用于向某些选择器添加特殊的效果。
CSS伪元素 用于将特殊的效果添加到某些选择器。

这TM不一样吗???

CSS中的类选择器(class)是为了方便过滤(选择)元素,给这类元素添加样式,class是定义在HTML文档树中的。但是这在一些情况下是不够用的,比如用[……]

Read more

media query

css2中的media type属性,用于判断媒体类型。而在css3中新增了 media query属性用于增强media type属性。media query属性的是media type属性的增强功能,使media type可以进行条件判断输出对应的css。

media query的使用方法[……]

Read more

CSS半透明背景

rgba支持IE8+。

[css]

filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 0,startColorstr = '#cc000000', endColorstr = '#cc000000' )\9[......]

Read more

CSS浏览器兼容性汇总

伪类和伪元素

名称
示例
版本

属性选择器
input[type=text]
IE7+

多类选择器
div.class1.class2
IE8+

透明
rgba() opacity*
IE9+

选择器
nth-chi[……]

Read more

CSS清除浮动的方法

1.添加空<div>标签或者<br />
[html]
<style type=”text/css”>
*{margin:0;padding:0;}
body{font:36px bold; color:#FFF; text-align:cente[……]

Read more

Mac系统safari设置

浮动的问题

可以使用<li>替换[……]

Read more

CSS布局问题总结

经典两栏自适应布局

HTML网页结构如下:

<body>
<div class="left">
</div>
<div class="right">
</div>
</body>
  1. 使用绝对定位。

CSS代码:

.[......]

Read more


TOP