2016年10月_柯南道尔2606

翻译 CSS 基础（023_图片小精灵）

原始网址：http://www.w3schools.com/css/css_image_sprites.asp翻译：CSS 图片小精灵（CSS Image Sprites）图片小精灵（Image Sprites）图片小精灵是指将图片集放入单张图片中。含有很多图片的 web 页面加载时间会很长，还会产生多个服务器请求。使用图片小精灵将减少服务期请求数、节省带宽（bandw

2016-10-29 00:05:31 1149 1

翻译 CSS 基础（022_图片画廊）

原始网址：http://www.w3schools.com/css/css_image_gallery.asp翻译：CSS 图片画廊（CSS Image Gallery）CSS 可用于创建图片画廊：html lang="en-US">head>meta http-equiv="Content-Type" content="text/html; charset=UTF-

2016-10-28 23:25:38 743

翻译 CSS 基础（021_提示框）

原始网址：http://www.w3schools.com/css/css_tooltip.asp翻译：CSS 提示框使用 CSS 创建提示框。演示：提示框示例当用户移动鼠标指针至元素之上的时候，提示框经常用以对相关内容指定额外信息： html>head>style>.w3-row::after { clear: both; conte

2016-10-28 21:27:27 1087

翻译 CSS 基础（020_下拉式菜单）

原始地址：http://www.w3schools.com/css/css_dropdowns.asp翻译：CSS 下拉式菜单（CSS Dropdowns）使用 CSS 创建可悬停、下拉式菜单。演示：下拉式菜单示例移动鼠标至以下示例：这里写代码片

2016-10-27 19:39:08 1102 1

翻译 CSS 基础（019_导航栏）

原始网址：http://www.w3schools.com/css/css_navbar.asp翻译：CSS 导航栏演示：导航栏 <!DOCTYPE html><html lang="en-US"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>CSS Navigation Bar<

2016-10-25 23:14:08 1408

翻译 CSS 基础（018_Opacity / Transparency）

原始网址：http://www.w3schools.com/css/css_image_transparency.asp翻译：CSS Opacity / Transparencyopacity 属性用以定义元素的 opacity/transparency 。Transparent Imageopacity 属性取值范围是 0.0 - 1.0 。值越低，越透明：

2016-10-25 22:22:31 727

翻译 CSS 基础（017_伪元素）

原始网址：http://www.w3schools.com/css/css_pseudo_elements.asp翻译：CSS 伪元素什么是伪元素？CSS 伪元素用以式样化元素的特定部分。例如，它有以下使用：式样化首字母、行或元素在元素内容的前、后插入新内容语法伪元素的语法：selector::pseudo-element { prop

2016-10-25 19:33:21 323

翻译 CSS 基础（016_伪类）

原始网址：http://www.w3schools.com/css/css_pseudo_classes.asp翻译：CSS Pseudo-classes什么是伪类？伪类用以定义元素的特定状态。例如，它被用于：当用户鼠标滑过时，定义元素的式样给已访问的链接和未访问的链接定义不同的式样给已获得焦点的元素定义式样 <!DOCTYPE html><html lang="en-US"><hea

2016-10-24 21:34:17 359

翻译 CSS 基础（015_Combinators）

原始网址：http://www.w3schools.com/css/css_combinators.asp翻译：CSS CombinatorsCSS Combinatorscombinator 用以解释选择器之间的关系。CSS 选择器可以包含多个简单选择器，在简单选择器之间，我们可以包含一个 combinator 。在 CSS3 中，有以下 4 种 combinator

2016-10-24 21:09:22 621

翻译 CSS 基础（014_Align）

原始网址：http://www.w3schools.com/css/css_align.asp翻译：CSS Layout - Horizontal & Vertical Alignhtml> head> style> h2 { font-size: 30px; font

2016-10-24 19:33:12 301

翻译 CSS 基础（013_行内-块）

CSS Layout - inline-blockThe inline-block Value创建盒子式的表格，使其占据浏览器的整个宽度，并且该表格被浏览器包裹得很好（任意改变浏览器窗口的大小），使用 float 属性在很长一段时间是可能。然而，将 display 属性设置为 inline-block 值以创建盒子式的表格会更容易。 inline-block 元素类似于行内（

2016-10-21 21:30:54 269

翻译 CSS 基础（012_浮动）

CSS Layout - float and clearfloat 属性指定元素是否需要浮动。 clear 属性用以控制浮动元素的行为。 html> head> style> div.left{ background-color: #2196F3; padding:

2016-10-20 19:13:55 296

原创 web前端（001_滚动效果）

示例：html> head> meta http-equiv="content-type" content="text/html; charset=utf-8" /> title>滚动效果title> style type="text/css"> div { border: 1px sol

2016-10-19 20:59:07 366

翻译 CSS 基础（011_Overflow）

原始网址：http://www.w3schools.com/css/css_overflow.asp翻译：CSS Layout - OverflowCSS Overflow当元素的内容太大而无法适应特定区域的时候，overflow 属性用以指定是剪切内容还是增加滚动条。 html lang="en-US"> head> style>

2016-10-18 22:31:09 262

翻译 CSS 基础（010_定位）

原始网址：http://www.w3schools.com/css/css_positioning.asp翻译：CSS Layout - The position Property

2016-10-18 21:03:47 497

翻译 CSS 基础（009_Max-width）

原始网址：http://www.w3schools.com/css/css_max-width.asp翻译：CSS Layout - width and max-width使用 width，max-width 和 margin: auto;在之前的章节中提到过，块级元素总是占据整行（向行左、右无限延伸）。对块级元素设置 width 会阻止它向父级容器的边界延伸。接下来，为了

2016-10-18 21:02:37 296

翻译 CSS 基础（008_显示）

原始网址：http://www.w3schools.com/css/css_display_visibility.asp翻译：CSS Layout - The display Propertydisplay 属性是控制布局的最重要的 CSS 属性。The display Propertydisplay 属性用以指定元素如何被显示。根据不同的元素类型，每一个 HTML

2016-10-15 11:42:25 537

翻译 CSS 基础（007_表格）

CSS Tables用 CSS 可以使 HTML 表格的外观得到极大改善： html lang="en-US"> head> title>CSS Styling Tablestitle> meta charset="utf-8"> style> table#customers {

2016-10-15 00:03:25 1301

翻译 CSS 基础（006_图标）

CSS Icons示例： html lang="en-US"> head> title>CSS Iconstitle> meta charset="utf-8"> link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.

2016-10-13 23:15:00 473

翻译 CSS 基础（005_轮廓）

原始网址：http://www.w3schools.com/css/css_outline.asp翻译：CSS OutlineCSS OutlineCSS 的 outline 属性用以指定轮廓的样式、颜色和宽。轮廓是围绕元素（边框之外）的线条，用以“凸显”元素。然而，outline 属性和 border 属性是不同的，outline 不是元素范围的部分；元素的总宽和高不

2016-10-13 21:34:20 435

翻译 CSS 基础（004_外边距）

原始网址：http://www.w3schools.com/css/css_margin.asp翻译：CSS Margins<!DOCTYPE html><html> <head> <style> div.line { border-style: solid none; border-w

2016-10-12 22:10:45 431

翻译 CSS 基础（003_盒子模型）

CSS Box ModelThe CSS Box Model所有的 HTML 元素都可以被认为是盒子。在 CSS 中，盒子模型的概念是被用来讨论设计和布局的。 CSS 盒子模型本质上是将每一个 HTML 元素包裹起来的盒子。它的组成部分为：margins，borders，padding 以及实际内容（元素）。下面的示例诠释了盒子模型：html lang="en-US">

2016-10-12 20:08:56 432

翻译 CSS 基础（002_边框）

原始网址：http://www.w3schools.com/css/css_border.asp翻译：CSS BordersCSS Border 属性CSS border 属性允许我们指定元素边框的样式、宽以及颜色。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>Select Sort</

2016-10-11 20:20:33 830

翻译 CSS 基础（001_语法）

原始网址：http://www.w3schools.com/css/css_syntax.asp翻译：CSS 语法和选择器CSS 语法CSS 规则集由选择器和声明块构成：选择器指向你想要修改其样式的 HTML 元素。声明块包含一个或多个由分号隔开的声明。每一个声明包含一个 CSS 属性和一个值，由冒号隔开。 CSS 声明总是以分号结束，声明块使用大括号包裹。在

2016-10-10 21:34:09 472

翻译 JavaScript 基础（007_闭包）

原始网址：http://www.w3schools.com/js/js_function_closures.asp翻译：JavaScript 闭包JS 变量的作用域只有两种：本地作用域、全局作用域。闭包使 JS 变量“私有化”成为可能。全局变量函数能够访问定义在它（函数体）之内的所有变量，例如：function myFunction() { var a =

2016-10-10 20:59:51 350

Google2606的博客