边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没发现这种技术之前,我们可能使用背景图像定位来显示一个园或箭头.幸运的是,我们能放下PS图象处理软件了. 基础 你可能很熟悉边的最基本用法. 1 border: 1px solid black; 上面的代码将给元素应用1px的边.即简洁又简单:但我们也可以稍作修改. 1 2 3 border-widt…

1.通过URL传递参数 传递参数页 function setCity() { var str = document.getElementById("cityName"); if (str.value == null || str.value == "") { alert('请输入到达城市!'); return; } else{ var url="5.html?cityName="+str.value; alert(url); var urlInf…

转自:http://blog.sina.com.cn/s/blog_13cc013b50102v49c.html(查看原文) 在VuGen中默认使用{}的字符串称为参数 注意:参数必须在双引号中才能用 将字符串保存为参数 lr_save_string("string you want to save", "arg_name"); 举例:用参数来替换需要打开的url链接 Action2() { lr_save_string("http://172.25.75…

新学习wxpython,一直纠结于窗口控件的排版,经过几天的查资料.试验,总结如下. 1.需求实例 来个实例,窗口有3行控件 第一行是文本提示(大小不变,文字左对齐,控件居左). 第二行依次为文本提示(控件居左,大小不变,文字横向左对齐,文字纵向居中对齐,),文本输入框(控件居左,大小横向向右缩放,纵向不缩放),按钮(控件居右,右边固定,大小向左缩放),按钮(控件居右,大小不变). 第三行多行文本框(控件扩展,大小四个方向扩展,直到占满剩余空间) 图1.窗口缩放前效果 图2.窗口缩放后效果 2.…

################################################### 问题:基础绘图plot   18.4.30 plot函数,基础绘图的各个参数? 解决方案: cars <- c(1, 3, 6, 4, 9); trucks <- c(2, 5, 4, 5, 12); suvs <- c(4,4,6,6,16) g_range <- range(0, cars)  #range()产生一个范围,本例即0-16 plot(cars, main =…

CSS不像其它高级语言一样支持算术运算.变量.流程控制与面向对象特性,所以CSS样式较多时会引起一些问题,如修改复杂,冗余,某些别的语言很简单的功能实现不了等.而javascript则是一种半面向对象的动态语言,有java的影子,有C的味道,中间有比其它语言多的糟粕,使用预处理办法可以解决这些问题.其中Less[les]与Sass是CSS的预处理技术,而CoffeeScript.TypeScript则是javascript的预处理技术. 一.Less 1.1.概要 Less是一种动态样式语言,L…

下载地址: http://www.html5tricks.com/jquery-html5-christ-snow.html 演示地址: http://www.html5tricks.com/jquery-html5-christ-snow.html 个人的demo: 新建并且引用以下js文件: (function($){ $.snowfall = function(element, options){ var defaults = { flakeCount : 35, flakeColor :…

CSS不像其它高级语言一样支持算术运算.变量.流程控制与面向对象特性,所以CSS样式较多时会引起一些问题,如修改复杂,冗余,某些别的语言很简单的功能实现不了等.而javascript则是一种半面向对象的动态语言,有java的影子,有C的味道,中间有比其它语言多的糟粕,使用预处理办法可以解决这些问题.其中Less[les]与Sass是CSS的预处理技术,而CoffeeScript.TypeScript则是javascript的预处理技术. 一.Less 1.1.概要 Less是一种动态样式语言,L…

我们使用扩展技术编写代码时,需要先用编译器将我们的文件进行编译,编译后的文件才能够使用. less技术相关语法 less相对来说比较简单,语法也较少:     变量的定义:     @w:20px;     变量的使用:     .p2{     width:@w     }     编译后的结果为:     .p2{     width:20px;     }          混合使用:     先定义:     .radius{     border-radius:10px;     }…

1.Quartz 2D是一个二维绘图引擎,同时支持ios和Mac系统: Quart2D的API是纯C语言的,API来自于Core  Graphics框架: 2.Quartz 2D可以绘制图形(线段/三角形/矩形/圆和弧).绘制文字.绘制和生成图片.读取/生成pdf.截图/裁剪图片.自定义UI控件等 3.对于界面复杂且个性化的UI,普通的UI控件无法实现,而Quartz2D技术却可以通过自定义UI控件来实现.其实,ios中大部分控件的内容都是通过Quart2D画出来的 4.图形上下文(Graphi…

在之前的文章里,我们探讨了基于多种不同技术来实现自定义的UIButton,当然不同的技术所涉及到的代码复杂度和难度也不一样.但是我也有意提到了基于不同方法的实现所体现出的性能表现也不一一相同.   [在屏幕背后的东西] 为了了解性能是如何受到影响的,我们需要进一步地观察iOS里图形实现背后的一些内容.下面这张图呈现了不同的frameworks和libraries之间的一些联系: 在最顶层的就是UIKit,一个在iOS中用来管理用户图形交互的Objc高级的框架,它由一系列的集合类构成,例如UIBu…

一.Lateral On-Scroll Sliding with jQuery的使用 View demo      Download source 1. HTML结构 <div id="ss-container" class="ss-container"> <div class="ss-row"> <div class="ss-left"> <h2 id="november&…

转自陶丰平的博客   原文的题目是Designing for iOS: Graphics & Performance,晚上花了两个不到小时大致翻译了下. ---Begin--- 在之前的文章里,我们探讨了基于多种不同技术来实现自定义的UIButton,当然不同的技术所涉及到的代码复杂度和难度也不一样.但是我也有意提到了基于不同方法的实现所体现出的性能表现也不一一相同. [在屏幕背后的东西] 为了了解性能是如何受到影响的,我们需要进一步地观察iOS里图形实现背后的一些内容.下面这张图呈现了不同的f…

1.CSS3 简介 CSS 指层叠样式表 (Cascading Style Sheets),用于控制网页的样式和布局,CSS3 是最新的 CSS 标准. 在网页制作时采用层叠样式表,可以有效的对页面的布局.字体.颜色.背景和其他效果实现更加精确的控制,只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分.通过仅仅编辑一个简单的 CSS 文件,外部样式表有能力同时改变站点中所有页面的布局和外观. CSS3 语言开发是朝着模块化发展的.之前的规范作为一个模块很庞大而且比较复杂,所以 CSS…

今天这篇文章向大家推荐十款非常有用的在线 CSS3 代码生成工具,这些工具能够帮助你方便的生成 CSS3 特效.CSS3 是对 CSS 规范的改善和增强,增加了圆角.旋转.阴影.渐变和动画等众多强大的特性,它使得 Web 开发人员可以很容易的在网站中加入时尚的效果.以前很多需要编写 JavaScript 才能实现的效果,如今只需几句简单的 CSS3 代码就能实现. CSS3 Maker 这款工具非常强大,可在线演示渐变.阴影.旋转.动画等非常多的效果,并生成对应效果的代码, Border Rad…

正如各位所知道的一样,css是一门标记性语言,语法相对简单,对使用者的要求也比较低 .不过可乐不知道友友们有没有发现,在使用css的时候需要书写大量看似没有逻辑的代码,不方便维护及扩展,不利于复用,尤其对于一些缺乏css编写经验的猿猿来讲,写出组织良好且易于维护的 CSS 代码是相当困难的一件事情.这个时候呢,可乐悄悄地告诉你们,咱们的程序员蜀黍是无所不能的,针对这个调皮的css,专门开发了less语言.那么,就由可乐来细细为你们介绍这一个新朋友吧~~~ 一.less简介: 1.less语言是在…

Compass核心模块Reset :重置CSS模块 @import "compass/reset" Layout :页面布局的控制能力 @import "compass/layout" 只有这两个模块是需要明确 指定引入的@import "compass"默认包含了其他五大模块却不包含resrt,layout 其他四个功能模块和Browser support模块CSS3:跨浏览器的CSS3能力Helpers:内含一系列的函数,跟SASS的函数列表…

随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来越重要了,从各处的招聘信息也能看出这一点.说这么说我想强调的是他的重要性.另一方面,有很多CSS3的效果真的不需我们自己一个一个去写,在这种情况就互联网上有关于CSS3的工具就出现了,这些工具将给你的制作节省很多时间,让你有更多的时间去做自己想要做的事情. SVG Edit SVG EDIT是一款在…

随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来越重要了,从各处的招聘信息也能看出这一点.说这么说我想强调的是他的重要性.另一方面,有很多CSS3的效果真的不需我们自己一个一个去写,在这种情况就互联网上有关于CSS3的工具就出现了,这些工具将给你的制作节省很多时间,让你有更多的时间去做自己想要做的事情.经过一年多的收集,我想有必要在w3cplus…

原文链接:scss 教程 手头上疯狂在用 scss,虽然可以在里面写原生的 css, 但是为了保持风格的一致性,还是滚去看了看 scss 文档. 一.变量 变量的引入是 scss 的一个核心特性,变量用来存储需要在CSS中复用的信息,例如颜色和字体.SASS通过$符号去声明一个变量. $font-stack: Helvetica, sans-serif; $primary-color: #333; body { font: 100% $font-stack; color: $primary-co…

插件描述:Toaster.js是一款Material Design风格jquery toast插件.Toaster.js提供5种主题,以及众多配置参数,用于显示toast类型的消息提示框.兼容性如下: Toaster.js Toaster.js是一款Material Design风格jquery toast插件.Toaster.js提供5种主题,以及众多配置参数,用于显示toast类型的消息提示框. Toaster.js的特点有: 提供5种主题风格. 可以设置Toast自动消失. 可以显示关闭按…

使用sass的前提是安装Ruby,如果是Mac系统,那么免去安装,Windows系统需要自行安装https://www.sass.hk/install/.当安装好以后,直接执行安装sass命令:gem install sass sass文件的后缀名是.scss,如果想要将sass文件转为css文件,那么执行:sass xxx.scss即可.sass的编译风格有四种,但是经常使用生产环境中的编译选项(最后一项): * nested:嵌套缩进的css代码,它是默认值. * expanded:没有缩进…

和以往一样,本次项目也放到了 Github 中,欢迎围观 star ~ 1. 前言 2. 基本概念 3. REM布局 4. VW布局 实现单边边框1px 实现多边边框1px 实现边框圆角 实现容器固定纵横比 5. REM + VW布局 6. 对比选择 方案选择 食用方式 一.前言 说到前端页面的布局方案,可以从远古时代的Table布局说起,然后来到 DIV+CSS布局,之后有了Float布局,Flex布局,Column布局,Grid布局等等. 而另一方面,还有一些 布局概念: 1. 静态布局 直…

1.继承和占位符 两者都是通过@extend来引用. 1.1 继承 一个已经存在的css样式类,可以被其他样式类继承. 例如,实现以下css样式: .btn, .btn--primary, .btn--info { border: 1px solid blue; } .btn--primary { color: black; } .btn--info { color: gray; } scss中可以这样写,显然,这种写法便于维护和阅读! .btn { border: 1px solid blue…

jquery.nicescroll.min.js滚动条使用方法,Nicescroll 是制作自定义滚动条的jq插件.支持div,iframe,html等使用,兼容IE7-8,safari,firefox,webkit内核浏览器(chrome,safari)以及智能终端设备浏览器的滚动条. 页面使用: $("html").niceScroll({ cursorcolor:"#E62020", cursoropacitymax:1, touchbehavior:fals…

Sass是成熟.稳定.强大的CSS预处理器,而SCSS是Sass3版本当中引入的新语法特性,完全兼容CSS3的同时继承了Sass强大的动态功能. 特性概览 CSS书写代码规模较大的Web应用时,容易造成选择器.层叠的复杂度过高,因此推荐通过SASS预处理器进行CSS的开发,SASS提供的变量.嵌套.混合.继承等特性,让CSS的书写更加有趣与程式化. 变量 变量用来存储需要在CSS中复用的信息,例如颜色和字体.SASS通过$符号去声明一个变量. $font-stack: Helvetica, sa…

7. 阴影.圆角.旋转.光标 (1)box-shadow 阴影 基本语法 text-shadow: h-shadow v-shadow blur color; box-shadow: h-shadow v-shadow blur spread color inset; 语法取值 h-shadow : 必需.水平阴影的位置.允许负值. v-shadow : 必需.垂直阴影的位置.允许负值. blur : 可选.模糊的距离. spread : 可选.阴影的大小. color : 可选.阴影的颜色.…

一.sublime text需要下载考拉,然后要 一直打开着: 1.编译工具用koala编译 下载地址:http://koala-app.com/index-zh.html 2.LESS中的注释: 可以使用css中的注释(/**/) 也可以用//注释 //编译时会自动过滤掉 二.webstrom 就不用下载考拉,还是推荐webstrom来写less比较方便 打开cmd,输入“cd C:\Program Files\nodejs”,回车,进入nodejs目录,输入npm install less…

.navdemo{ width:560px; height: 50px; font:bold 0/50px Arial; text-align:center; margin:40px auto 0; background: #f65f57; /*制作圆*/ border-radius:5px; /*制作导航立体风格*/ box-shadow:0 5px 5px 0px gray; } .navdemo a{ display: inline-block; -webkit-transition: a…

官方介绍: 浏览器支持:IE9+, Firefox 4+, Chrome, Safari 5+,和Opera支持border-radius属性. border-radius 属性是一个最多可指定四个 border -*- radius 属性的复合属性 提示: 这个属性允许你为元素添加圆角边框! css语法: border-radius: - length|% / - length|%; 注意: 每个半径的四个值的顺序是:左上角,右上角,右下角,左下角.如果省略左下角,右上角是相同的.如果省略右下…