前几天在公司做开发的时候碰到一个列表横向滑动的功能，当时用了iscroll做，结果导致手指触到列表的范围内竖向滑动屏幕滑动不了的问题。这个问题不知道iscroll本身能不能解决，当时选择了换一种方式来做，只要css就能搞定了，主要是利用了display:-webkit-box来实现。<!DOCTYPE html><html><head><title>横向滑动</title><style type="text/css">.slide-box{margin-top: 200px;display: -webkit-box;overflow-x: scroll;-webkit-ov...
从大图中选取部分区域作为目标图标by:授客 QQ：10335531221、图片素材图片素材如下（大小：137px * 264px），图中从上到下，连续存放了两张100px * 100px的图 2、HTML代码html代码如下：<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> .icon { width:100px; /*--设置背景图显示区域宽度--*/ height:100px;/*--设置背景图...
你正在学习CSS布局吗?是不是还不能完全掌握纯CSS布局?通常有两种情况阻碍你的学习： 第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前，你应当先考虑内容的语义和结构，然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。 另一种原因是你对那些非常熟悉的表现层属性(例如：cellpadding,、hspace、align=left等等)束手无策，不知道该转换成对应的什么CSS语句。当你解决了第一种...
HTML5 & CSS3 准备就绪 该网站通过扇形图表的形式展现了从08年到10年以来各大浏览器对HTML5和CSS3的支持情况。发展势头还是很可观的。HTML5安全手册CSS3按钮生成器 所见即所得的为你生成CSS3按钮，你仅需通过基本的鼠标点击便可生成令人满意的CSS3按钮，点击生成好的按钮即可查看相应的CSS3代码。When can I use…（HTML5 & CSS3 浏览器兼容性） 很详细的关于HTML5, CSS3, SVG等技术的浏览器兼容性列表。CSS3颜色值/名称速...
background: -webkit-linear-gradient(90deg, #556270 10%, #FF6B6B 90%);background: -moz-linear-gradient(90deg, #556270 10%, #FF6B6B 90%);background: -ms-linear-gradient(90deg, #556270 10%, #FF6B6B 90%);background: -o-linear-gradient(90deg, #556270 10%, #FF6B6B 90%);background: linear-gradient(90deg, #556270 10%, #FF6B6B 90%); 动画库使用微场景页面/* animation sets *//* 移动 from / to */.pt-page-move...
最近在读《Basic Visual Formatting in CSS》，结合以前看的《css权威指南》和css标准。今天就做个笔记。 以前在遇到一些宽度不明确指明的一些布局的时候，虽然凭感觉能猜出个大概，但是总是有点不是很靠谱。直到最近看到这一本书，觉得总觉得挺好的。 首先要知道，元素除了通过display来指定block、inline、inline-block这一些属性之外，还有一种能在的特性--替换还是非替换。 替换元素：像img、video、canvas等稳定...
transform：对对象属性进行动画编辑（可用于有渐变效果的动画）一、transition：动画的过度效果注：始终设置 transition-duration 属性，否则时长为 0，就不会产生过渡效果。transition的属性值及其用法：1.transition-property 规定设置过渡效果的 CSS 属性的名称。2.transition-duration 规定动画过度需要的时间3.transition-timing-function 动画的过度曲线注：linear：用于相同速度开始至结束的过渡效果4.transition-delay ...
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>什么什么Ａｐｐ</title></head><head><body><a href="">首页</a><a href="">下载ａｐｐ</a>搜索:<input></nav><style type="text/css">p{color:red;}</style><body><p>什么什么什么 </p></body><div id="container" style="width:400px "... ><div id="header" style="background-color:#FFA500;"><h2 align="center" style="margin-bottom:0;">登录</h2><div...
CSS中简单的表达式，成为规则。一个典型的规则包括一个选择符、若干属性和属性值。1.在XHTML中直接添加CSS样式，必须在<head>元素里添加样式开始和结束标记。（但这未必是最好的方法）<style type="text/css">.....</style>color属性用于改变字体颜色。font-family属性用来设置字体的格式。border-bottom属性用来控制元素下划线的外观（如border： 1px solid black）。一般把元素之间共有的样式组合在一起（如果要改动，只需修改一...
CSScss是英文Cascading Style Sheets的缩写,称为层叠样式表，用于对页面进行美化。存在方式有三种：元素内联、页面嵌入和外部引入，比较三种方式的优缺点。语法：style = ‘key1:value1;key2:value2;‘在标签中使用 style=‘xx:xxx;‘在页面中嵌入 < style type="text/css"> </style > 块引入外部css文件css写在head里面，style标签中写样式ID用 #号来表示，class 可以用 .表示在css里面注释用/* xxxxxxxxxxxxxxxxx */ 表示标...
本章内容：简介CSS 定义四种引入方式样式应用的顺序选择器（Selector）* 通用元素选择器标签选择器class 类选择器# ID选择器, 多元素选择器 后代元素选择器子元素选择器' ref='nofollow'>> 子元素选择器+ 毗邻元素选择器[] 属性选择器伪类选择器常用属性颜色属性（color 、transparent、opacity）字体属性（font-style、 font-weight、font-size、 font-family、font）文本属性（white-space、direction、text-align、line-height、...
一、搞定 CSSCSS 文件将被 Meteor 自动加载并简化。因此，不同于其它的静态文件都被放置于/public 文件夹，请将 CSS文件放入/client 文件夹。请创建一个client/stylesheets/ 文件夹并将以下style.css 文件放置入内。.grid-block, .main, .post, .comments li, .comment-form { background: #fff; border-radius: 3px; padding: 10px; margin-bottom: 10px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0...
本文实例讲述了Python格式化css文件的方法。分享给大家供大家参考。具体实现方法如下： import string, sys import re, StringIO TAB=4 def format(ss):f = open (ss, "r")data = f.read()f.close()dlen = len(data)i = 0buf = StringIO.StringIO()start = 0while i < dlen:if data[i] == ‘{‘:buf.write(data[start:i] + ‘ { ‘)i = i + 1start = ielif data[i] == ‘}‘:last = string.strip(data[start:i])if last:buf.write(...
CSS基础知识1.1基本概念CSS（Cascading Style Sheet） 层叠样式表，为了实现页面内容和表现形式的分离。层叠的含义是可以对一个元素多次设置样式，最后的结果是多次样式叠加的结果，如果有冲突，以后面的样式为准。1.2 基本语法选择器{属性名1:属性值1;属性名2:属性值2;属性名3:属性值3;……}选择器说明该样式施加于哪些元素；属性名和属性值说明是样式内容；一般一行定义一条样式，当然也可以写在一行上，但每条样式都序号加上“；...
background-color: #2a3138;position: fixed;bottom: 0;left: 0;width: 100%;height: 57px;overflow: hidden; 原文：http://www.cnblogs.com/jdhu/p/4346003.html