font | 易学教程

less 学习笔记

阅读更多关于 less 学习笔记

一、介绍 Less （Leaner Style Sheets 简洁的样式表）是一门向后兼容的 CSS 预处理语言，它扩展了CSS 语言。 less is more. 几种 css 预处理语言的诞生先后顺序： Sass 诞生于 2007 年，Ruby 编写，其语法功能都十分全面，可以说它完全把 CSS 变成了一门编程语言。另外在国内外都很受欢迎，并且它的项目团队很是强大，是一款十分优秀的预处理语言。 Less 诞生于 2009 年，受 Sass 的影响创建的一个开源项目。它扩充了 CSS 语言，增加了诸如变量、混合（mixin）、函数等功能，让 CSS 更易维护、方便制作主题、扩充。 Stylus 诞生于 2010 年，来自 Node.js 社区，语法功能也和 Sass 不相伯仲，是一门十分独特的创新型语言。二、安装 & 使用 1、在 Node.js 环境： npm install -g less > lessc styles.less styles.css 2、在浏览器环境： <link rel="stylesheet/less" type="text/css" href="styles.less" /> <script src="//cdnjs.cloudflare.com/ajax/libs/less.js/3.10.0-beta/less.min.js" ><

浅谈前端移动端页面开发（布局篇）

阅读更多关于浅谈前端移动端页面开发（布局篇）

前言的一些碎碎念：最近一直在写移动端的页面，不过一直是用的别人造好的轮子，很多时候并没有想那是为什么，那是怎么样要那么写，就跟着别人的文档去了。本以为自己对移动端的那一丢丢理解，结果很多东西都特么有问题，所以，今天停下了手中的一些东西，来谈下移动端的布局方案吧一. viewport 什么是viewport 简单来讲，viewport就是浏览器上，用来显示网页的那一部分区域了，也就是说，浏览器的实际宽度，是和我们手机的宽度不一样的，无论你的手机宽度是320px，还是640px，在手机浏览器内部的宽度，始终会是浏览器本身的viewport。如今的浏览器，都会给自己的本身提供一个viewport的默认值，可能是980px，或者是其他值。就以手机来说吧，目前，新版本的手机浏览器，绝大部分是以980px作为默认的viewport值的。我这里对新版本的不同平台下的浏览器做了测试，经过测试，iphone下的默认viewport为980px，安卓下的浏览器，目前主流的最新浏览器（比如chrome，还有很多国产的像qq，uc）的viewport也是980px了。 viewport是用来干什么的 viewport的默认值，一般来说是大于手机屏幕的。这样就可以做到当我们在浏览桌面端网页的时候，可以让桌面端端网页正常显示（我们普通页面设计的时候，一般页面的主区域是以960px来做的，所以980px这个值

精通移动端布局 - 实践篇 -

阅读更多关于精通移动端布局 - 实践篇 -

本文大多数的内容基本都是从多篇博客或相关文章中进行筛选，提炼出来，原本我也想用我匮乏的语言来描述，但是发现别人已经总结的更好了，所以...我还是乖乖的站在巨人的肩膀上吧~~ 完整目录：基本概念物理像素设备独立像素 CSS 像素 PPI的概念 DPR的概念缩放的概念 viewPort 的概念 viewport 渲染流程 Meta 标签说明移动端布局实践混合方式 REM 方式响应式 JS自动换算缩放方式 CSS3 缩放 viewport 缩放相关补充为什么需要meta标签？传统响应式布局与移动端响应式的区别移动端字体以及大小的设置移动端背景图缩放设置使用Sass提高px与rem转换效率通过Chrome进行真机调试 weinre 远程调试移动端布局实践混合方式混合方式实现的移动端布局实际上就是对PC端布局技术的组合使用，它主要包含以下技术：定位布局浮动布局可塑性布局百分比布局相对单位将这些布局方法根据页面每个不同部分的特性进行组合使用，例如模态框，弹出层等可以采用定位方式，而页面元素的排版可以采用浮动布局，也可以使用具有可塑性的Flex布局方案，对于元素的尺寸可以采用百分比或者其它相对单位,而这便是我称之为“混合方式”的原因。混合方式进行的移动端网页布局，所采用的技术通常都具有灵活、可伸缩、可塑等特点，甚至连使用的单位，最好都是相对单位

opencv+python 添加文字 cv2.putText

阅读更多关于 opencv+python 添加文字 cv2.putText

import cv2 img = cv2.imread('caijian.jpg') font = cv2.FONT_HERSHEY_SIMPLEX imgzi = cv2.putText(img, '000', (50, 300), font, 1.2, (255, 255, 255), 2) 无论是 cv2.imshow('',img) cv2.waitKey() cv2.destroyAllWindows() 或是 cv2.imshow('',imgzi) cv2.waitKey() cv2.destroyAllWindows() 结果看到的图都是带有文字的说明：进行putText操作之后，读取原图像也是具有文字显示的但是原图的文件并没有被改变图1：图2：若想再次看到原图，则应该在之前先备份一个原图像 import cv2 img = cv2.imread('pyyy.png') img2 = img.copy() # 备份操作 font = cv2.FONT_HERSHEY_SIMPLEX # 定义字体 imgzi = cv2.putText(img, '000', (50, 50), font, 1.2, (255, 255, 255), 2) # 图像，文字内容，坐标，字体，大小，颜色，字体厚度 cv2.imshow('origin',img) #

环形队列

阅读更多关于环形队列

package com.cxy.springdataredis.data; import java.util.Scanner; public class CircleArray { public static void main(String[] args) { CirCleArrayQueue queue = new CirCleArrayQueue(4); boolean loop =true; char key ; Scanner scanner = new Scanner(System.in); while (loop) { System.out.println("s(show): 显示队列"); System.out.println("e(exit): 退出程序"); System.out.println("a(add): 添加数据到队列"); System.out.println("g(get): 从队列取出数据"); System.out.println("h(head): 查看队列头的数据"); key = scanner.next().charAt(0);// 接收一个字符 switch (key) { case 's': queue.showQueue(); break; case 'a': System.out.println("输出一个数"); int

JavaScript API GL beta添加多个Marker和InfoWindow

阅读更多关于 JavaScript API GL beta添加多个Marker和InfoWindow

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" /> <meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="black" name="apple-mobile-web-app-status-bar-style" /> <meta content="telephone=no" name="format-detection" /> <title>Hello world!</title> <style type="text/css"> *{ padding: 0; margin: 0; } .mapContainer{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; overflow: hidden; } #container { /*地图(容器)显示大小*/ position:

前台页面对数据的增删除改查操作

阅读更多关于前台页面对数据的增删除改查操作

后台管理中，基本就是对数据的增加改查，今天写了一个DEMO，把它分享出来，如下图： JS代码如下：复制代码 1 2 3 4 五 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 三十 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 var user = [<font></font> {id: 1, cardId: "6225880287860549" , pwd: "909090" , money: 9000},<font

Game 2048

阅读更多关于 Game 2048

1 //事件处理对象 2 //addHandler() 方法接受3个参数：要操作的元素、事件名称和事件处理程序函数。 3 var EventUtil = { 4 addHandler: function (element, type, handler) { 5 if (element.addEventListener) { 6 element.addEventListener(type, handler, false); 7 } else if (element.attachEvent) { 8 element.attachEvent("on" + type, handler); 9 } else { 10 element["on" + type] = handler; 11 } //处理浏览器之间的差异 12 }, 13 14 //获取事件对象 15 getEvent: function (event) { 16 return event ? event : window.event; //兼容IE 17 } 18 19 } 20 21 //创建Game对象 22 function Game2048(tileCon, scoreEle, bestScoreEle) { 23 this.tileContainer = tileCon; 24 this.scoreEle =

博客园皮肤

阅读更多关于博客园皮肤

主题地址 silence 博客皮肤 blacklowkey 页面定制css代码 body{background:#fff;min-height:100%!important;color:#314659!important;font-family:Lato,"PingFang SC","Microsoft YaHei",sans-serif!important}a{transition:all .3s ease!important}a:hover{color:#2D8CF0!important;text-decoration:none!important}#ad_c1,#ad_c2,#ad_t2,#author_profile,#blogCalendar,#blogTitle h2,#comment_form_container p:nth-of-type(3),#comments_pager_top,#green_channel,#homepage_top_pager,#sidebar_imagecategory,#sidebar_postarchive,#sidebar_recentcomments,#sidebar_recentposts,#sidebar_scorerank,#sidebar_search,#sidebar_shortcut,#sidebar

[原创]Lodop打印, 以及Lodop引用css文件控制打印样式的问题.

阅读更多关于 [原创]Lodop打印, 以及Lodop引用css文件控制打印样式的问题.

最近在做Lodop打印功能: 思路是: 用MasterPage搭个打印页面的框架, 然后在具体的页面中填入数据, 打印的样式由母版页和CSS来控制. 困扰了一天的问题是: 在打印的JS文件中, 引用外部css文件时, 需要拼出实际的含有IP地址的CSS文件地址 , 并且需要用双斜杠(//)来代替单斜杠 . =====后来遇到的问题: css文件里的样式, 在页面上显示没有问题, 但是打印预览却没有样式.... 又挣扎了一天, 原来问题是: lodop中的加入css文件后, 不能识别css类(.baseInfo)这样的样式, 得写到具体的元素中才可以, 如: (.baseInfo Table)下的css才会生效. 对于Repeater中的Table标签, 貌似也加载不了样式, 最后网repeater的Table标签设置了一个ClassName, 才生效. =====为了能让页眉、页脚、以及内容页, 全部都应用CSS中的样式, 着实费了一番功夫. 不知道是不是<link....> + HTML的方式不好使还是我没弄清楚, CSS样式表无法全部生效(只有用ADD_PRINT_HTM的部分生效, 其他不生效). 最终, 在JS中用ajax获取CSS文件内容, 然后采用<style...>+HTML的方式解决. 代码如下: //母版页, 注意: url的拼接形式 <input id=

订阅 font