.firDemoButton{
padding: 6px 16px;
border: 1px solid #446d88;
background: #58a linear-gradient(#77a0bb, #58a);
border-radius: 4px;
box-shadow: 0 1px 5px gray;
color: white;
text-shadow: 0 -1px 1px #335166;
font-size: 20px;
line-height: 30px;
}
.secDemoButton{
font-size: 26px;
}
.thirDemoButton{
font-size: 26px;
line-height: 39px;
}
.colorButton{
padding: .3em .8em;
border: 1px solid #446d88;
background: #58a linear-gradient(hsla(0,0%,100%,.2), transparent);
border-radius: .2em;
box-shadow: 0 .05em .25em gray;
color: white;
text-shadow: 0 .05em .25em #335166;
font-size: 1.3em;
line-height: 1.5;
}
.cancel { background-color: #c00;
}
.ok { background-color: #6b0;
}

Introduction

CSS SECRETS AMAZON 链接

本系列的文章是翻译过程中的心得,并非原文的完全照搬,需要PDF的同学,欢迎向博主索取

CSS Secrets 翻译笔记 01: CSS coding tips的更多相关文章

  1. css通用小笔记01——导航背景

    很多刚接触前端的可能遇到一些css能解决的小问题,我现在总结了一些,将会逐渐和大家分享,先是导航的背景问题,在网页中常常看到,当鼠标放到一个导航按钮上面是,就会出现一些特效,比如背景,这是最常用的,我 ...

  2. Css技术入门笔记01

    在学习html的时候,html中的标签都具备了特定功能,或者含义,以及相应的样式效果.可是在有些时候我们可能仅仅希望使用 html标签把要显示的数据封装起来,而不需要任何的样式效果.这时就需要单独的标 ...

  3. CSS学习笔记01 CSS简介

    1.CSS定义 CSS 指层叠样式表 (Cascading Style Sheets),是一种样式表语言,用来描述 HTML 或 XML(包括如 SVG.XHTML 之类的 XML 分支语言)文档的呈 ...

  4. [css 揭秘]-css coding tips

    css 揭秘之css coding tips demo(1) html 代码: <body> <section> <div class="demo1" ...

  5. 总结了一下css的部分基础知识点。---css学习笔记01

    一. css基础 1. 什么是css 层叠样式表:层叠 2. css的三种使用方式 style 属性 --> <div style="css属性值"></d ...

  6. CSS揭秘读书笔记 (一)

    CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background: ...

  7. 《CSS揭秘》笔记(一)

    前言 我们在现代 CSS 中所面临的挑战已经不在于如何绕过这些转瞬即逝的浏览器 bug.如今的挑战是,在保证 DRY ① .可维护.灵活性.轻量级并且尽可能符合标准的前提下,把我们手中的这些CSS特性 ...

  8. css随堂笔记(三)

    Css随堂笔记(三) 1 关于背景图片   A 设置背景图片:background-image:url(“图片的路径”):   B 背景图片位置: background-position:1 方位名词 ...

  9. (2)《Head First HTML与CSS》学习笔记---img与基于标准的HTML5

    1.浏览器处理图像的过程: 1.服务器获取文件,显示出文本结构,以及预留默认的大小给<img>(如果该<img>有width-1值和height-1值,则根据这个值提前设好页面 ...

随机推荐

  1. js 分享代码--完整示例代码

    <div class="bdsharebuttonbox" data-tag="share_1"> <a class="bds_ms ...

  2. 自然语言处理:问答 + CNN 笔记

    参考 Applying Deep Learning To Answer Selection: A Study And An Open Task follow: http://www.52nlp.cn/ ...

  3. BZOJ_2716_[Violet 3]天使玩偶&&BZOJ_2648_SJY摆棋子_KDTree

    BZOJ_2716_[Violet 3]天使玩偶&&BZOJ_2648_SJY摆棋子_KDTree Description 这天,SJY显得无聊.在家自己玩.在一个棋盘上,有N个黑色棋 ...

  4. 采用Psyco实现python执行速度提高到与编译语言一样的水平

    本文实例讲述了采用Psyco实现python执行速度提高到与编译语言一样的水平的方法,分享给大家供大家参考.具体实现方法如下: 一.安装Psyco很简单,它有两种安装方式,一种是源码方式,一种是二进制 ...

  5. TModJS:使用tmodjs

    ylbtech-TModJS:使用tmodjs 1.返回顶部 1. 1.安装 npm install -g tmodjs 2.配置 我的模板都放在tpl文件夹中,htmls用于存放模板页面,每一个后缀 ...

  6. Linux查看CPU《型号..》《内存..》《硬盘..》《系统..》

    1.查看物理cpu个数 grep 'physical id' /proc/cpuinfo | sort -u | wc -l 2.查看核心数量grep 'core id' /proc/cpuinfo ...

  7. Firebug 的脚本页面不能用

    1.遇到这种情况,一般重置firebug,然后开启“脚本“功能,刷新页面,就能显示正常 2.要不就是 版本问题,50.0不行,下载回49版本就可以了

  8. Tomcat之the jre_home environment variable is not defined correctly this environment variable is need

    参考https://blog.csdn.net/qq_30507287/article/details/53981851 今天在服务器的tomcat上部署.war文件,双击startup闪退,然后在t ...

  9. 20个Flutter实例视频教程-第11节: 一个不简单的搜索条-2

    博客地址: https://jspang.com/post/flutterDemo.html#toc-1b4 视频地址:https://www.bilibili.com/video/av3970929 ...

  10. 洛谷1087 FBI树 解题报告

    洛谷1087 FBI树 本题地址:http://www.luogu.org/problem/show?pid=1087 题目描述 我们可以把由“0”和“1”组成的字符串分为三类:全“0”串称为B串,全 ...