- 博客(70)
- 收藏
- 关注
RSS订阅原创 CSS: div高度自动适应背景图片的高度 How to get div height to auto-adjust to background size?...
原文：CSS: div高度自动适应背景图片的高度 How to get div height to auto-adjust to background size? 其实方法非常简单，直接写代码：<div style="background-image: url(http://your-image.jpg);"> <img src="http://your-ima...
2016-07-29 13:00:27
1255
原创 PHP5: mysqli 插入, 查询, 更新和删除 Insert Update Delete Using mysqli (CRUD)
原文: PHP5: mysqli 插入, 查询, 更新和删除 Insert Update Delete Using mysqli (CRUD) PHP 5 及以上版本建议使用以下方式连接 MySQL :MySQLi extension ("i" 意为 improved)PDO (PHP Data Objects)Mysqli提供了...
2016-07-29 12:55:58
808
原创 域名详解
域名域名就是用来唯一标示互联网上的服务器的，当我们访问一个网站时候，比如http://www.example.com/index.html，其中的com，example.com，www.example.com都是域名。域名不区分大小写，即www.example.com与WWW.EXAMPLE.COM一样。 FQDNFQDN(Fully qualified domain name)...
2016-07-29 12:51:51
476
原创 移动开发需要知道的像素知识『多图』
像素（Pixel）对于WEB开发者来说很是熟悉，在PC互联网时代没少与其打交道。进入移动互联网之后，随着移动设备屏幕的解析度越来越高，衍生了一些关于屏幕和像素的一些新概念，比如DPI，DP，PT，Retina，4K等等，本文对这些概念做一个简单的介绍。 DPI与PPIDPI（Dots Per Inch）是印刷行业中用来度量空间点密度用的，这个值是打印机每英寸可以喷的墨汁点数。计算机显...
2016-07-29 12:48:07
153
原创 HTML5: 两个viewport的故事（第一部分）
英文：http://www.quirksmode.org/mobile/viewports.html翻译：http://weizhifeng.net/viewports.html 在这个迷你系列的文章里边我将会解释viewport，以及许多重要元素的宽度是如何工作的，比如<html>元素，也包括窗口和屏幕。 这 篇文章是关于桌面浏览器的，其唯一的目的就是为移动浏览...
2016-07-29 12:45:53
139
原创 HTML5: 两个viewport的故事（第二部分）
英文：http://www.quirksmode.org/mobile/viewports2.html翻译：http://weizhifeng.net/viewports2.html 在这个迷你系列的文章里边我将会解释viewport，以及许多重要元素的宽度是如何工作的，比如<html>元素，也包括窗口和屏幕。 这篇文章我们来聊聊关于移动浏览器的内容。如果你对移动...
2016-07-28 05:23:30
332
原创 CSS3 媒体查询移动设备尺寸 Media Queries for Standard Devices （包括 苹果手表 apple watch）...
1. Phones and Handheldsa) iPhones/* ----------- iPhone 4 and 4S ----------- *//* Portrait and Landscape */@media only screen and (min-device-width: 320px) and (max-device-width: 4...
2016-07-28 05:18:29
164
原创 CSS3: 移动端开发中 max-device-width 与 max-width 的区别
翻译自stackoverflow.com，源地址：http://stackoverflow.com/questions/6747242/what-is-the-difference-between-max-device-width-and-max-width-for-mobile-web 有同学需要开发web页在iphone/android手机上访问，想问max-device-width...
2016-07-28 05:17:55
2521
原创 CSS：媒体查询 CSS3 Media Queries
定义和使用使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有用的。当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。 浏览器支持表格中的数字表示支持 @media 规则的第一个浏览器的版本号。 CSS 语法...
2016-07-28 05:11:11
240
原创 CSS: SASS用法指南 (附视频)
观看视频: CSS: SASS用法指南 学过CSS的人都知道，它不是一种编程语言。你可以用它开发网页样式，但是没法用它编程。也就是说，CSS基本上是设计师的工具，不是程序员的工具。在程序员眼里，CSS是一件很麻烦的东西。它没有变量，也没有条件语句，只是一行行单纯的描述，写起来相当费事。很自然地，有人就开始为CSS加入编程元素，这被叫做"CSS预处理器"（css p...
2016-07-28 05:05:52
139
原创 MongoDB 教程索引 (附有视频)
MongoDB 教程索引 MongoDB 教程一: 安装和使用 (Mongodb启动命令mongod参数说明)MongoDB 教程二: 添加, 删除，查询 shell命令MongoDB 教程三: 高级查询MongoDB 教程三: 高级查询 （SQL到MongoDB映射表）MongoDB 教程四: 高级更改操作MongoDB 教程番外篇之管理工具: Rockmongo...
2016-07-27 10:54:28
121
原创 九张 Gif 图回顾 Web 设计的 25 年历史
原文出处： fastcodesign 译文出处：码农网 – 小峰 Froont，一家为web设计师制作工具的旧金山公司，用9个GIF格式动画来表现网页设计在过去25年的发展历程。如果你想知道为什么CSS这么重要，为什么Flash会逐渐淘汰，这些动画图或许能让你一窥究竟。网页设计的单色时代，约1989年。想想Lynx和其他以Unix为基础的web浏览器，这些浏览器只会通过网络...
2016-07-27 10:51:30
129
原创 设计: 未来Web设计的7大趋势
原文出处： Medium 译文出处：朵璞 1. 手势取代点击我们都已经忘记滚动条曾经是有多麻烦，大多数用户都得煞费苦心地把鼠标移至屏幕右侧来移动这古老的滚动条：作为一名专业人士，想必你一定用过鼠标滚轮、光标键或触控板，那么你就已经超越了许多用户了。在当今这个时代，滑动已取代了点击。手机用户轻松滑动手指即可随意滚动页面，相对而言，要精准地点击某一点反倒是变得困...
2016-07-27 10:50:40
269
原创 设计: 从登录开始
原文出处： 迅雷CUED 登录？ 两个输入框加一个按钮？还能怎么做？ 那就先来看看为什么而做？就数据而言，网站的流量仍是大量的匿名用户带来的。我们无法根据请求的任何方面（ip地址，用户代理等）准确识别来自同一人的连续请求。不能识别，自然无法对其分类进而转化挖掘，获取网站所需的价值。互联网服务于人，要开发一个真正令人动心的网站，我们必须触达到浏览器后面那...
2016-07-27 10:49:55
148
原创 自适应网页设计/响应式Web设计 （Responsive Web Design）
随着3G的普及，越来越多的人使用手机上网。 移动设备正超过桌面设备，成为访问互联网的最常见终端。于是，网页设计师不得不面对一个难题：如何才能在不同大小的设备上呈现同样的网页？ 手机的屏幕比较小，宽度通常在600像素以下；PC的屏幕宽度，一般都在1000像素以上（目前主流宽度是1366×768），有的还达到了2000像素。同样的内容，要在大小迥异的屏幕上，都呈现出满意的效果，并不是...
2016-07-27 07:52:12
231
原创 什么是Viewport Meta（width详解）及在手机上的应用
查看视频地址： 什么是Viewport Meta（width详解）及在手机上的应用 viewport 是专为手机浏览器设计的一个meta标签； 有些屏幕很小有智能手机，但分辩率却可以做得很大，比如小米４的默认分辨率 为：1920*1080，比许多电脑桌面的都还大，传统桌面网站直接放到手机上阅读时，界面就会显得非常小，阅读体验就很差，就样就需要一种将原始视图在 手机上放大的机制，使...
2016-07-26 12:29:30
561
原创 什么是响应式Web设计？怎样进行？
开 始第一篇。老规矩，先无聊的谈论天气一类的话题。十一长假，天气也终于开始有些秋天的味道，坐在屋里甚至觉得需要热咖啡。话说两年前也是在国庆假期里开始 做Joomla文档翻译的；长假好时光，总会可以抽出一两天，安静的窝在家里做做博客、学做些新东西，简直没有比这更舒心的事情。 说正事 儿。准备在近期的几篇里集中翻译学习一下“响应式Web设计”的相关话题，包括概念、实践方式、案例及...
2016-07-26 12:27:40
2877
原创 LESS vs SASS？选择哪种CSS样式编程语言?
你可能已经被关于应该用Sass还是用LESS的争论折磨死了。在这篇文章中，我会解释为什么你应该使用Sass。如果你感兴趣，我会介绍如何开始使用Sass以及在预处理时会遇到的一些问题。 在我的长篇大论之前，让我稍微提一下，你应该先学一下LESS。LESS对于初学者来说是极好的：它非常容易使用和设置，它跟CSS非常像,写起来非常直观，简单还有友好，我曾经非常喜欢LESS。 直到最近我...
2016-07-26 12:26:53
1235
原创 CSS3: Media Query实现响应式Web设计
十一长假已然过去了一大半。今天倒真是晴朗的不行，向窗外望去几乎可以看到阳光穿过凉爽的空气一缕缕洒落下来的样子。自从不再是学生，对每年的几次 长假就无比珍惜，想方设法让每一天都尽量过的饱满一些；夜里闭上眼，满脑子就都是Drupal、博客、咖啡、使命召唤、南方公园...也许需要出门走一走 了。 OK开始说正经的了。在之前一篇译文中，我们了解了响应式Web设计的概念、组成要素以及基本的实现思路...
2016-07-26 12:14:03
105
原创 CSS: 居中一个宽度为auto的块元素 (width:auto;margin:auto) center an auto-width div
for parent block or body - text-align:center; for centerd block- display:inline-block;<style>body{text-align:center}.center{display:inline-block;background:red}</style><...
2016-07-26 12:12:06
727
原创 CSS：理解:Before和:After伪元素
CSS样式表的主要作用是修饰Web页面上的HTML标记，但有时候，为了实现某个效果而往页面里反复添加某个HTML标记很繁琐，或者是显得多余，或者是由于某种原因而做不到。这就是CSS伪元素(Pseudo-Element)可以发挥作用的地方，所谓‘伪元素’，就是本身不存在的页面元素，HTML代码里并没有这样的元素，但在页面显示时，你却能看到这些本来不存在的元素发挥着作用。 观看演示 ...
2016-07-23 07:48:19
144
原创 你所不知的 CSS ::before 和 ::after 伪元素用法
CSS 有两个说不上常用的伪类 :before 和 :after，偶尔会被人用来添加些自定义格式什么的，但是它们的功用不仅于此。前几天发现了 Creative Link Effects 这个非常有意思的介绍创意链接特效的页面，里面惊人的效果大量使用到的特性除了 transform 属性进行变形之外，就是接下来要介绍的这两个伪元素了。 一 基本语法在了解进阶的应用之前，先来了解一下...
2016-07-23 07:45:31
84
原创 CSS: HTML 和 Body 的区别
在 CSS 中，<html> 和 <body> 的区别往往被忽略，全局样式或者定义在 <html> 上，或者定义在 <body> 上。实际上，两者是有区别的，不论是 CSS 老鸟还是新手，都应该了解。 HTML 和 Body 如何关联<!DOCTYPE html> <html lang="en">
2016-07-23 07:43:07
1030
原创 进一步理解CSS浮动与清除浮动
本文主要探讨两个问题：为什么CSS设置浮动会引起父元素塌陷为什么设置clear:both能清除浮动，并撑开父元素。 起因CSS的浮动，算是我在写网页时用的最多的属性之一。但要说我对浮动的了解程度的话，只能说“知其然而不知其所以然”。虽然很多人都说浮动会用就行，但是要想成为一个优秀的前端，对这些常用属性得知根知底。恰巧在慕课网，张鑫旭老师开了《CSS深入理解之flo...
2016-07-23 07:41:25
202
原创 关于CSS浮动(float,clear)的通俗讲解（经验分享）
很早以前就接触过CSS，但对于浮动始终非常迷惑，可能是自身理解能力差，也可能是没能遇到一篇通俗的教程。 前些天小菜终于搞懂了浮动的基本原理，迫不及待的分享给大家。 写在前面的话：由于CSS内容比较多，小菜没有精力从头到尾讲一遍，只能有针对性的讲解。如果读者理解CSS盒子模型，但对于浮动不理解，那么这篇文章可以帮助你。小菜水平有限，本文仅仅是入门教程，不当之处请谅解！...
2016-07-23 07:33:39
113
原创 清除浮动的最佳方案：clearfix
CSS清除浮动float闭合，很多同学都在使用下面的骨灰级解决办法：.clear{clear:both;} 或者.clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear，我们知道这样能解决基本清浮动问题。但是这种方法的最大缺陷就是改变了html结构，虽然只是加个d...
2016-07-22 02:48:10
635
原创 CSS尺寸和字体单位-em、px还是%
在页面整体布局中，页面元素的尺寸大小（长度、宽度、内外边距等）和页面字体的大小也是重要的工作之一。一个合理设置，则会让页面看起来层次分明， 重点鲜明，赏心悦目。反之，一个不友好的页面尺寸和字体大小设置，则会增加页面的复杂性，增加用户对页面理解的复杂性；甚至在当下访问终端 （iPhone、iPad、PC、Android…）层出不穷的今天，适应各式各样的访问终端，将成为手中的一块“烫手的山芋”。所以...
2016-07-22 02:45:10
135
原创 CSS3实现的响应式字体：自适应视图窗口大小的新单位
这个是为了解决什么问题？ 我最近在做一个项目。客户要求标题可以根据用户屏幕的尺寸而自动改变大小。我知道我通常用的相对字体单位（注* 如px, pt, em）只是相对于HTML根元素的大小而自动改变，而不是相对于用户的屏幕。 在上网查询之后我发现一种新的字体大小单位，叫做：Viewport-Percentage Lengths. 我是在一MDN的一篇文章 中发现这个View...
2016-07-22 02:44:09
1650
原创 IE6,IE7和8浏览器兼容HTML5标签的解决方案
html5大行其道的时代已经到来。如果你还在等待浏览器兼容，说明你已经与web脱节几条街了。当然，这得益于移动客户端的蓬勃发展。如果还在纠 结于，是否应该掌握html5和css3技术时，请狠狠的抽自己几个嘴巴，然后，苦学吧！因为前端的春天已经到来，而且不止一个春天。如果你不信，我只能 说：爱信不信！下面我们来看一个标准的html5标签结构：（我这里只是说标签，其它概不涉及）<!DO...
2016-07-22 02:43:30
265
原创 win8、win10如何修改文件夹的权限
在windows10或win8中要获得文件夹的权限也不是一件容易的事。查阅网上主要有两种方法，一种是手工，另一种是有 注册表。 一、第一种方法。主要分为两步。首先要获得文件夹的所有权，然后再获取权限。 好 吧，下面开始进入正题。我会以图文形式来详细说明如何获取一个文件（或文件夹）的最高权限，拥有了最高权限，无论什么文件都是可以删除的。我的系统是 windows 8，用wind...
2016-07-22 02:37:48
1361
原创 开启Windows或者Mac OSX 本地服务器 (非安装第三方服务器软件)
因为安全的原因，无法直接在浏览器中打开工程目录下的index.html文件。 你必须在你的电脑中搭建一个本地服务器。本小节会解释如何做。 在Windows下搭建本地服务器 开启Internet Information Service在“控制面板”中，点击“程序”。点击“启用或关闭Windows功能”。在“Windows功能”窗口中...
2016-07-21 01:52:58
191
原创 CSS学习之外边距合并
外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。 外边距合并外边距合并（叠加）是一个相当简单的概念。但是，在实践中对网页进行布局时，它会造成许多混淆。简单地说，外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。...
2016-07-21 01:50:41
149
原创 你们的2016年前端学习计划是什么？
2015年，软件开发界发生了很多变化。有很多流行的新语言发布了，也有很多重要的框架和工具发布了新版本。下面有一个我们觉得最重要的简短清单，同时也有我们觉得值得你在2016年花时间精力去学习的新事物的一些建议。 大趋势在过去的几年里，有一个越来越明显的趋势是web应用的商业逻辑逐步从后端转移到了前端，然后后端变得只需要处理简单的数据API。这就让前端开发框架的选择变...
2016-07-21 01:47:53
150
原创 大公司里怎样开发和部署前端代码？
这是一个非常有趣的 非主流前端领域，这个领域要探索的是如何用工程手段解决前端开发和部署优化的综合问题，入行到现在一直在学习和实践中。 在我的印象中，facebook是这个领域的鼻祖，有兴趣、有梯子的同学可以去看看facebook的页面源代码，体会一下什么叫工程化。 接下来，我想从原理展开讲述，多图，较长，希望能有耐心看完。让我们返璞归真，从原始的前端开发讲起。上图...
2016-07-21 01:47:12
157
原创 想说爱你不容易，浏览器缓存浅谈
今天小微开店宝在测试环境发布更新的时候，同事问：“为什么我需要手动清理浏览器缓存才能看到变更？难道系统上线后也需要客户自己清理浏览器缓存吗！”看来，这个坑需要我来填了。 什么是浏览器缓存浏览器缓存(Brower Caching)是浏览器在本地磁盘对用户最近请求过的文档进行存储，当访问者再次访问同一页面时，浏览器就可以直接从本地磁盘加载文档。浏览器缓存的优点有：减少...
2016-07-21 01:43:34
92
原创 深入理解CSS权重(优先级)
对于上一篇：你应该知道的一些事情——CSS权重 ，实战时会遇到一些实际的问题，本篇继续加重对css优先级的理解。最近跟公司同事分享session时在谈到CSS优先级权重问题，引入了之前一直在网上公认的权重计算公式，有好奇者问了一个ClASS选 择器组合与ID选择器优先级问题，如果按公式套下来，CLASS组合后是应该高于ID的，但结果实验并非如此，好奇之下，又在晚上找了找，总结如下。顺序：“i...
2016-07-20 14:05:11
2063
原创 你应该知道的一些事情——CSS权重
本文由99根据Vitaly Friedman的《CSS Specificity: Things You Should Know 》所译，整个译文带有我们自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://coding.smashingmagazine.com/2007/07/27/css-specificity-thing...
2016-07-20 14:00:22
101
原创 CSS语法和CSS优先级
语法层叠样式表（ Cascading Stylesheet ，简称CSS ）， 其基本目标是让浏览器以指定的特性去绘制页面元素，比如颜色，定位，装饰。CSS的语法反映了这个目标，由下面两个部分构建：属性（ property）是一个标识符，用可读的名称来表示其特性。值（value）则描述了浏览器引擎如何处理该特性。每个属性都包含一个有效值的集合，它有正式的语法和语义定义...
2016-07-20 13:53:42
168
原创 Ubuntu: 安装 Sublime Text 2 或者 3 How to Install Sublime Text 2 or 3 in Ubuntu 15.0
Sublime Text is a cross-platform text and source code editor with a Python API. It is a sophisticated text editor for code, markup and prose. Its functionality is extendable with plugins. Most ...
2016-07-20 13:44:19
239
原创 Bootstrap 3: 图标转换事件 Change icons when toggle
代码：<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" /><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.j...
2016-07-20 13:39:52
333
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人