<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Google2606的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Google2606</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Google2606]]></copyright><item><title><![CDATA[CSS3 基础（015_媒体查询 - 示例）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53095554</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53095554</guid><author>Google2606</author><pubDate>Wed, 09 Nov 2016 19:54:06 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_mediaqueries_ex.asp

翻译：

CSS3 媒体查询 - 示例（CSS3 Media Queries - Examples）



CSS3 媒体查询 - 更多示例（CSS3 Media Queries - More Examples）

请查看使用 media queries 的更多示例。 
我们以名]]></description><category></category></item><item><title><![CDATA[CSS3 基础（014_媒体查询）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53081620</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53081620</guid><author>Google2606</author><pubDate>Tue, 08 Nov 2016 21:16:49 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_mediaqueries.asp翻译：CSS3 媒体类型（CSS3 Media Queries）CSS2 中介绍的媒体类型（CSS2 Introduced Media Types）@media 规则出现于 CSS2，这使得对不同媒体类型定义不同样式成为可能。 
例如：你可能针对电脑屏幕、打印机、手持设备、电视类设备等等有各]]></description><category></category></item><item><title><![CDATA[CSS3 基础（013_Flexible Box）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53078706</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53078706</guid><author>Google2606</author><pubDate>Tue, 08 Nov 2016 20:55:01 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_flexbox.asp

翻译：

CSS3 Flexible Box



CSS3 Flexbox

在 CSS3 中，flexible boxes 或 flexbox 是一种新的布局模式。 
当页面的布局必须适应不同的屏幕尺寸和不同的显示设备时，flexbox 的使用确保元素的行为可预见。 
对许多应用而言，fle]]></description><category></category></item><item><title><![CDATA[CSS3 基础（012_Box Sizing）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53066662</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53066662</guid><author>Google2606</author><pubDate>Mon, 07 Nov 2016 22:38:07 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_box-sizing.asp

翻译：

CSS3 Box Sizing



CSS3 Box Sizing

CSS3 box-sizing 属性允许我们将内边距和边框包含在元素的总宽高之内。



Browser Support

表格里的数字代表对 CSS3 属性全面支持的各浏览器的第一个版本号。 
数字之后跟从]]></description><category></category></item><item><title><![CDATA[CSS3 基础（011_用户接口）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53066097</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53066097</guid><author>Google2606</author><pubDate>Mon, 07 Nov 2016 22:15:53 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_user_interface.asp

翻译：

CSS3 用户接口（CSS3 User Interface）



CSS3 用户接口

CSS3 有新的用户接口特点，例如 resizing elements、outlines 以及 box sizing 。 
本章，你将学习以下用户接口属性：


resize
out]]></description><category></category></item><item><title><![CDATA[CSS3 基础（010_多列布局）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53064583</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53064583</guid><author>Google2606</author><pubDate>Mon, 07 Nov 2016 22:07:58 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_multiple_columns.asp

翻译：

CSS3 多列（CSS3 Multiple Columns）



CSS3 多列布局（CSS3 Multi-column Layout）

CSS3 多列布局对文本的多列定义来说是很容易的，它的效果如同报纸： 





html>
head>
style>
.w3]]></description><category></category></item><item><title><![CDATA[CSS3 基础（009_按钮）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53063360</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53063360</guid><author>Google2606</author><pubDate>Mon, 07 Nov 2016 21:43:27 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_buttons.asp

翻译：

CSS 按钮（CSS Buttons）



学习使用 CSS 如何样式化按钮。



基本按钮样式（Basic Button Styling）

.button {
    background-color: #4CAF50; /* Green */
    border: none]]></description><category></category></item><item><title><![CDATA[CSS3 基础（008_图片）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53034115</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53034115</guid><author>Google2606</author><pubDate>Fri, 04 Nov 2016 19:51:38 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_images.asp

翻译：

CSS 图片（CSS Images）



学习使用 CSS 如何样式化图片。



圆角图片（Rounded Images）

使用 border-radius 属性创建圆角图片：



img {
    border-radius: 8px;
}




html>
head>
s]]></description><category></category></item><item><title><![CDATA[CSS3 基础（007_动画）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53032881</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53032881</guid><author>Google2606</author><pubDate>Fri, 04 Nov 2016 19:21:54 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_animations.asp

翻译：

CSS3 动画（CSS3 Animations）



CSS3 动画（CSS3 Animations）

CSS3 animations 允许在不使用 JavaScript 或 Flash 的情况下对元素添加动画效果！




html>
head>
style>
#anima]]></description><category></category></item><item><title><![CDATA[CSS3 基础（006_过渡）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53022197</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53022197</guid><author>Google2606</author><pubDate>Thu, 03 Nov 2016 21:27:28 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_transitions.asp翻译：CSS3 过渡（CSS3 Transitions）CSS3 过渡CSS3 过渡允许你在给定的持续时间之内以平缓地改变属性值（从一个值改变为另一个值）。示例：鼠标指针悬停于下列元素之上以观察 CSS3 的过渡效果 
<!DOCTYPE html>
<html>
<head>
<style>]]></description><category></category></item><item><title><![CDATA[CSS3 基础（005_3D 变换）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53020516</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53020516</guid><author>Google2606</author><pubDate>Thu, 03 Nov 2016 20:51:08 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_3dtransforms.asp

翻译：

CSS3 3D 变换（CSS3 3D Transforms）



CSS 3D 变换

CSS3 允许你使用 3D 变换（3D transformations）格式化元素。 
将鼠标指针移至以下元素，查看 2D 和 3D 变换的区别：  



html lang="en-]]></description><category></category></item><item><title><![CDATA[CSS3 基础（005_2D 变换）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53008625</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53008625</guid><author>Google2606</author><pubDate>Wed, 02 Nov 2016 21:10:13 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_2dtransforms.asp翻译：CSS3 2D 变换（CSS3 2D Transforms）CSS3 变换（CSS3 Transforms）CSS3 变换允许你对元素进行移动（translate）、旋转（rotate）、伸缩（scale）、倾斜（skew）。 
变换效果是，让元素改变形状、大小和位置。 
CSS3 支]]></description><category></category></item><item><title><![CDATA[CSS3 基础（004_文本）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53007444</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53007444</guid><author>Google2606</author><pubDate>Wed, 02 Nov 2016 20:38:09 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_text_effects.asp

翻译：

CSS3 文本



CSS3 文本

CSS3 包含几个新的文本特征。

在本章，你将学习到以下文本属性：


text-overflow
word-wrap
word-break]]></description><category></category></item><item><title><![CDATA[CSS3 基础（003_背景）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/53004450</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/53004450</guid><author>Google2606</author><pubDate>Wed, 02 Nov 2016 19:33:47 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_backgrounds.asp

翻译：

CSS3 背景（CSS3 Backgrounds）






html>
head>
style>
#example1 {
    background: url("http://www.w3schools.com/css/img_flwr.gif") no-repeat]]></description><category></category></item><item><title><![CDATA[CSS3 基础（002_边框图）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52996393</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52996393</guid><author>Google2606</author><pubDate>Tue, 01 Nov 2016 21:21:48 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_border_images.asp翻译：CSS3 边框图（CSS3 Border Images）<!DOCTYPE html>
<html>
<head>
<style>
#border_image_top {
    -moz-border-bottom-colors: none;
    -moz-border-lef]]></description><category></category></item><item><title><![CDATA[CSS3 基础（001_圆角）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52993543</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52993543</guid><author>Google2606</author><pubDate>Tue, 01 Nov 2016 21:11:50 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css3_borders.asp

翻译：

CSS3 圆角（CSS3 Rounded Corners）








html>
head>
style>
.w3-theme-border {
    border-color: #4caf50 !important;
}

.w3-codespan {
    backgro]]></description><category></category></item><item><title><![CDATA[CSS 基础（026_计数器）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52992282</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52992282</guid><author>Google2606</author><pubDate>Tue, 01 Nov 2016 21:06:25 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css_counters.asp

翻译：

CSS 计数器（CSS Counters）



CSS 计数器是由 CSS 维护的“变量”，它的值能够根据 CSS 规则（追踪它们的执行次数）不断累加。计数器让我们可以基于内容所在文档的位置来调整它的外观。



Automatic Numbering With Counters]]></description><category></category></item><item><title><![CDATA[CSS 基础（025_表单）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52980685</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52980685</guid><author>Google2606</author><pubDate>Tue, 01 Nov 2016 20:30:28 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css_form.asp

翻译：

CSS 表单



使用 CSS 能够对 HTML 表单的外观进行极大地改善： 





html lang="en-US">
head>
meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
title>CSS]]></description><category></category></item><item><title><![CDATA[CSS 基础（024_属性选择器）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52979367</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52979367</guid><author>Google2606</author><pubDate>Tue, 01 Nov 2016 19:55:28 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css_attribute_selectors.asp

翻译：

CSS 属性选择器（CSS Attribute Selectors）



样式化带有特定属性的 HTML 元素

样式化具有特定属性或属性值的 HTML 元素是可能的。



CSS [attribute] 选择器

[attribute] 选择器选择带有特定属]]></description><category></category></item><item><title><![CDATA[CSS 基础（023_图片小精灵）]]></title><link>https://blog.youkuaiyun.com/Google2606/article/details/52955378</link><guid>https://blog.youkuaiyun.com/Google2606/article/details/52955378</guid><author>Google2606</author><pubDate>Sat, 29 Oct 2016 00:05:31 +0800</pubDate><description><![CDATA[原始网址：http://www.w3schools.com/css/css_image_sprites.asp

翻译：

CSS 图片小精灵（CSS Image Sprites）



图片小精灵（Image Sprites）

图片小精灵是指将图片集放入单张图片中。 
含有很多图片的 web 页面加载时间会很长，还会产生多个服务器请求。 
使用图片小精灵将减少服务期请求数、节省带宽（bandw]]></description><category></category></item></channel></rss>