注释中address是纠正的意思  等价于correct
/*!
Pure v0.5.0
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
https://github.com/yui/pure/blob/master/LICENSE.md
*/
/*!
normalize.css v1.1.3 | MIT License | git.io/normalize
Copyright (c) Nicolas Gallagher and Jonathan Neal
*/
/*! normalize.css v1.1.3 | MIT License | git.io/normalize */ /* ==========================================================================
HTML5 display definitions
========================================================================== */ /**
* Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
*/ article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
} /**
* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
*/ audio,
canvas,
video {
display: inline-block;
*display: inline;
*zoom:;
} /**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/ audio:not([controls]) {
display: none;
height:;
} /**
* Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
* Known issue: no IE 6 support.
*/ [hidden] {
display: none;
} /* ==========================================================================
Base
========================================================================== */ /**
* 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
* `em` units.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/ html {
font-size: 100%; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
} /**
* Address `font-family` inconsistency between `textarea` and other form
* elements.
*/ html,
button,
input,
select,
textarea {
font-family: sans-serif;
} /**
* Address margins handled incorrectly in IE 6/7.
*/ body {
margin:;
} /* ==========================================================================
Links
========================================================================== */ /**
* Address `outline` inconsistency between Chrome and other browsers.
*/ a:focus {
outline: thin dotted;
} /**
* Improve readability when focused and also mouse hovered in all browsers.
*/ a:active,
a:hover {
outline:;
} /* ==========================================================================
Typography
========================================================================== */ /**
* Address font sizes and margins set differently in IE 6/7.
* Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
* and Chrome.
*/ h1 {
font-size: 2em;
margin: 0.67em 0;
} h2 {
font-size: 1.5em;
margin: 0.83em 0;
} h3 {
font-size: 1.17em;
margin: 1em 0;
} h4 {
font-size: 1em;
margin: 1.33em 0;
} h5 {
font-size: 0.83em;
margin: 1.67em 0;
} h6 {
font-size: 0.67em;
margin: 2.33em 0;
} /**
* Address styling not present in IE 7/8/9, Safari 5, and Chrome.
*/ abbr[title] {
border-bottom: 1px dotted;
} /**
* Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
*/ b,
strong {
font-weight: bold;
} blockquote {
margin: 1em 40px;
} /**
* Address styling not present in Safari 5 and Chrome.
*/ dfn {
font-style: italic;
} /**
* Address differences between Firefox and other browsers.
* Known issue: no IE 6/7 normalization.
*/ hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height:;
} /**
* Address styling not present in IE 6/7/8/9.
*/ mark {
background: #ff0;
color: #000;
} /**
* Address margins set differently in IE 6/7.
*/ p,
pre {
margin: 1em 0;
} /**
* Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
*/ code,
kbd,
pre,
samp {
font-family: monospace, serif;
_font-family: 'courier new', monospace;
font-size: 1em;
} /**
* Improve readability of pre-formatted text in all browsers.
*/ pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
} /**
* Address CSS quotes not supported in IE 6/7.
*/ q {
quotes: none;
} /**
* Address `quotes` property not supported in Safari 4.
*/ q:before,
q:after {
content: '';
content: none;
} /**
* Address inconsistent and variable font size in all browsers.
*/ small {
font-size: 80%;
} /**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/ sub,
sup {
font-size: 75%;
line-height:;
position: relative;
vertical-align: baseline;
} sup {
top: -0.5em;
} sub {
bottom: -0.25em;
} /* ==========================================================================
Lists
========================================================================== */ /**
* Address margins set differently in IE 6/7.
*/ dl,
menu,
ol,
ul {
margin: 1em 0;
} dd {
margin: 0 0 0 40px;
} /**
* Address paddings set differently in IE 6/7.
*/ menu,
ol,
ul {
padding: 0 0 0 40px;
} /**
* Correct list images handled incorrectly in IE 7.
*/ nav ul,
nav ol {
list-style: none;
list-style-image: none;
} /* ==========================================================================
Embedded content
========================================================================== */ /**
* 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
* 2. Improve image quality when scaled in IE 7.
*/ img {
border:; /* 1 */
-ms-interpolation-mode: bicubic; /* 2 */
} /**
* Correct overflow displayed oddly in IE 9.
*/ svg:not(:root) {
overflow: hidden;
} /* ==========================================================================
Figures
========================================================================== */ /**
* Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
*/ figure {
margin:;
} /* ==========================================================================
Forms
========================================================================== */ /**
* Correct margin displayed oddly in IE 6/7.
*/ form {
margin:;
} /**
* Define consistent border, margin, and padding.
*/ fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
} /**
* 1. Correct color not being inherited in IE 6/7/8/9.
* 2. Correct text not wrapping in Firefox 3.
* 3. Correct alignment displayed oddly in IE 6/7.
*/ legend {
border:; /* 1 */
padding:;
white-space: normal; /* 2 */
*margin-left: -7px; /* 3 */
} /**
* 1. Correct font size not being inherited in all browsers.
* 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
* and Chrome.
* 3. Improve appearance and consistency in all browsers.
*/ button,
input,
select,
textarea {
font-size: 100%; /* 1 */
margin:; /* 2 */
vertical-align: baseline; /* 3 */
*vertical-align: middle; /* 3 */
} /**
* Address Firefox 3+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/ button,
input {
line-height: normal;
} /**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
* Correct `select` style inheritance in Firefox 4+ and Opera.
*/ button,
select {
text-transform: none;
} /**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
* 4. Remove inner spacing in IE 7 without affecting normal text inputs.
* Known issue: inner spacing remains in IE 6.
*/ button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
*overflow: visible; /* 4 */
} /**
* Re-set default cursor for disabled elements.
*/ button[disabled],
html input[disabled] {
cursor: default;
} /**
* 1. Address box sizing set to content-box in IE 8/9.
* 2. Remove excess padding in IE 8/9.
* 3. Remove excess padding in IE 7.
* Known issue: excess padding remains in IE 6.
*/ input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding:; /* 2 */
*height: 13px; /* 3 */
*width: 13px; /* 3 */
} /**
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
* (include `-moz` to future-proof).
*/ input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
} /**
* Remove inner padding and search cancel button in Safari 5 and Chrome
* on OS X.
*/ input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
} /**
* Remove inner padding and border in Firefox 3+.
*/ button::-moz-focus-inner,
input::-moz-focus-inner {
border:;
padding:;
} /**
* 1. Remove default vertical scrollbar in IE 6/7/8/9.
* 2. Improve readability and alignment in all browsers.
*/ textarea {
overflow: auto; /* 1 */
vertical-align: top; /* 2 */
} /* ==========================================================================
Tables
========================================================================== */ /**
* Remove most spacing between table cells.
*/ table {
border-collapse: collapse;
border-spacing:;
} /*csslint important:false*/ /* ==========================================================================
Pure Base Extras
========================================================================== */ /**
* Extra rules that Pure adds on top of Normalize.css
*/ /**
* Always hide an element when it has the `hidden` HTML attribute.
*/ [hidden] {
display: none !important;
} /**
* Add this class to an image to make it fit within it's fluid parent wrapper while maintaining
* aspect ratio.
*/
.pure-img {
max-width: 100%;
height: auto;
display: block;
} /*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/ .pure-g {
letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
*letter-spacing: normal; /* reset IE < 8 */
*word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */ /*
Sets the font stack to fonts known to work properly with the above letter
and word spacings. See: https://github.com/yui/pure/issues/41/ The following font stack makes Pure Grids work on all known environments. * FreeSans: Ships with many Linux distros, including Ubuntu * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and
Arial to get picked up by the browser, even though neither is available
in Chrome OS. * Droid Sans: Ships with all versions of Android. * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows.
*/
font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif; /*
Use flexbox when possible to avoid `letter-spacing` side-effects. NOTE: Firefox (as of 25) does not currently support flex-wrap, so the
`-moz-` prefix version is omitted.
*/ display: -webkit-flex;
-webkit-flex-flow: row wrap; /* IE10 uses display: flexbox */
display: -ms-flexbox;
-ms-flex-flow: row wrap;
} /* Opera as of 12 on Windows needs word-spacing.
The ".opera-only" selector is used to prevent actual prefocus styling
and is not required in markup.
*/
.opera-only :-o-prefocus,
.pure-g {
word-spacing: -0.43em;
} .pure-u {
display: inline-block;
*display: inline; /* IE < 8: fake inline-block */
zoom:;
letter-spacing: normal;
word-spacing: normal;
vertical-align: top;
text-rendering: auto;
} /*
Resets the font family back to the OS/browser's default sans-serif font,
this the same font stack that Normalize.css sets for the `body`.
*/
.pure-g [class *= "pure-u"] {
font-family: sans-serif;
} .pure-u-1,
.pure-u-1-1,
.pure-u-1-2,
.pure-u-1-3,
.pure-u-2-3,
.pure-u-1-4,
.pure-u-3-4,
.pure-u-1-5,
.pure-u-2-5,
.pure-u-3-5,
.pure-u-4-5,
.pure-u-5-5,
.pure-u-1-6,
.pure-u-5-6,
.pure-u-1-8,
.pure-u-3-8,
.pure-u-5-8,
.pure-u-7-8,
.pure-u-1-12,
.pure-u-5-12,
.pure-u-7-12,
.pure-u-11-12,
.pure-u-1-24,
.pure-u-2-24,
.pure-u-3-24,
.pure-u-4-24,
.pure-u-5-24,
.pure-u-6-24,
.pure-u-7-24,
.pure-u-8-24,
.pure-u-9-24,
.pure-u-10-24,
.pure-u-11-24,
.pure-u-12-24,
.pure-u-13-24,
.pure-u-14-24,
.pure-u-15-24,
.pure-u-16-24,
.pure-u-17-24,
.pure-u-18-24,
.pure-u-19-24,
.pure-u-20-24,
.pure-u-21-24,
.pure-u-22-24,
.pure-u-23-24,
.pure-u-24-24 {
display: inline-block;
*display: inline;
zoom:;
letter-spacing: normal;
word-spacing: normal;
vertical-align: top;
text-rendering: auto;
} .pure-u-1-24 {
width: 4.1667%;
*width: 4.1357%;
} .pure-u-1-12,
.pure-u-2-24 {
width: 8.3333%;
*width: 8.3023%;
} .pure-u-1-8,
.pure-u-3-24 {
width: 12.5000%;
*width: 12.4690%;
} .pure-u-1-6,
.pure-u-4-24 {
width: 16.6667%;
*width: 16.6357%;
} .pure-u-1-5 {
width: 20%;
*width: 19.9690%;
} .pure-u-5-24 {
width: 20.8333%;
*width: 20.8023%;
} .pure-u-1-4,
.pure-u-6-24 {
width: 25%;
*width: 24.9690%;
} .pure-u-7-24 {
width: 29.1667%;
*width: 29.1357%;
} .pure-u-1-3,
.pure-u-8-24 {
width: 33.3333%;
*width: 33.3023%;
} .pure-u-3-8,
.pure-u-9-24 {
width: 37.5000%;
*width: 37.4690%;
} .pure-u-2-5 {
width: 40%;
*width: 39.9690%;
} .pure-u-5-12,
.pure-u-10-24 {
width: 41.6667%;
*width: 41.6357%;
} .pure-u-11-24 {
width: 45.8333%;
*width: 45.8023%;
} .pure-u-1-2,
.pure-u-12-24 {
width: 50%;
*width: 49.9690%;
} .pure-u-13-24 {
width: 54.1667%;
*width: 54.1357%;
} .pure-u-7-12,
.pure-u-14-24 {
width: 58.3333%;
*width: 58.3023%;
} .pure-u-3-5 {
width: 60%;
*width: 59.9690%;
} .pure-u-5-8,
.pure-u-15-24 {
width: 62.5000%;
*width: 62.4690%;
} .pure-u-2-3,
.pure-u-16-24 {
width: 66.6667%;
*width: 66.6357%;
} .pure-u-17-24 {
width: 70.8333%;
*width: 70.8023%;
} .pure-u-3-4,
.pure-u-18-24 {
width: 75%;
*width: 74.9690%;
} .pure-u-19-24 {
width: 79.1667%;
*width: 79.1357%;
} .pure-u-4-5 {
width: 80%;
*width: 79.9690%;
} .pure-u-5-6,
.pure-u-20-24 {
width: 83.3333%;
*width: 83.3023%;
} .pure-u-7-8,
.pure-u-21-24 {
width: 87.5000%;
*width: 87.4690%;
} .pure-u-11-12,
.pure-u-22-24 {
width: 91.6667%;
*width: 91.6357%;
} .pure-u-23-24 {
width: 95.8333%;
*width: 95.8023%;
} .pure-u-1,
.pure-u-1-1,
.pure-u-5-5,
.pure-u-24-24 {
width: 100%;
}
.pure-button {
/* Structure */
display: inline-block;
*display: inline; /*IE 6/7*/
zoom:;
line-height: normal;
white-space: nowrap;
vertical-align: baseline;
text-align: center;
cursor: pointer;
-webkit-user-drag: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} /* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner {
padding:;
border:;
} /*csslint outline-none:false*/ .pure-button {
font-family: inherit;
font-size: 100%;
*font-size: 90%; /*IE 6/7 - To reduce IE's oversized button text*/
*overflow: visible; /*IE 6/7 - Because of IE's overly large left/right padding on buttons */
padding: 0.5em 1em;
color: #444; /* rgba not supported (IE 8) */
color: rgba(0, 0, 0, 0.80); /* rgba supported */
*color: #444; /* IE 6 & 7 */
border: 1px solid #999; /*IE 6/7/8*/
border: none rgba(0, 0, 0, 0); /*IE9 + everything else*/
background-color: #E6E6E6;
text-decoration: none;
border-radius: 2px;
} .pure-button-hover,
.pure-button:hover,
.pure-button:focus {
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000',GradientType=0);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0, 0.05)), to(rgba(0,0,0, 0.10)));
background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
background-image: -moz-linear-gradient(top, rgba(0,0,0, 0.05) 0%, rgba(0,0,0, 0.10));
background-image: -o-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
}
.pure-button:focus {
outline:;
}
.pure-button-active,
.pure-button:active {
box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset;
} .pure-button[disabled],
.pure-button-disabled,
.pure-button-disabled:hover,
.pure-button-disabled:focus,
.pure-button-disabled:active {
border: none;
background-image: none;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
filter: alpha(opacity=40);
-khtml-opacity: 0.40;
-moz-opacity: 0.40;
opacity: 0.40;
cursor: not-allowed;
box-shadow: none;
} .pure-button-hidden {
display: none;
} /* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner{
padding:;
border:;
} .pure-button-primary,
.pure-button-selected,
a.pure-button-primary,
a.pure-button-selected {
background-color: rgb(0, 120, 231);
color: #fff;
} .pure-form input[type="text"],
.pure-form input[type="password"],
.pure-form input[type="email"],
.pure-form input[type="url"],
.pure-form input[type="date"],
.pure-form input[type="month"],
.pure-form input[type="time"],
.pure-form input[type="datetime"],
.pure-form input[type="datetime-local"],
.pure-form input[type="week"],
.pure-form input[type="number"],
.pure-form input[type="search"],
.pure-form input[type="tel"],
.pure-form input[type="color"],
.pure-form select,
.pure-form textarea {
padding: 0.5em 0.6em;
display: inline-block;
border: 1px solid #ccc;
box-shadow: inset 0 1px 3px #ddd;
border-radius: 4px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
} /*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form input:not([type]) {
padding: 0.5em 0.6em;
display: inline-block;
border: 1px solid #ccc;
box-shadow: inset 0 1px 3px #ddd;
border-radius: 4px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
} /* Chrome (as of v.32/34 on OS X) needs additional room for color to display. */
/* May be able to remove this tweak as color inputs become more standardized across browsers. */
.pure-form input[type="color"] {
padding: 0.2em 0.5em;
} .pure-form input[type="text"]:focus,
.pure-form input[type="password"]:focus,
.pure-form input[type="email"]:focus,
.pure-form input[type="url"]:focus,
.pure-form input[type="date"]:focus,
.pure-form input[type="month"]:focus,
.pure-form input[type="time"]:focus,
.pure-form input[type="datetime"]:focus,
.pure-form input[type="datetime-local"]:focus,
.pure-form input[type="week"]:focus,
.pure-form input[type="number"]:focus,
.pure-form input[type="search"]:focus,
.pure-form input[type="tel"]:focus,
.pure-form input[type="color"]:focus,
.pure-form select:focus,
.pure-form textarea:focus {
outline:;
outline: thin dotted \9; /* IE6-9 */
border-color: #129FEA;
} /*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form input:not([type]):focus {
outline:;
outline: thin dotted \9; /* IE6-9 */
border-color: #129FEA;
} .pure-form input[type="file"]:focus,
.pure-form input[type="radio"]:focus,
.pure-form input[type="checkbox"]:focus {
outline: thin dotted #333;
outline: 1px auto #129FEA;
}
.pure-form .pure-checkbox,
.pure-form .pure-radio {
margin: 0.5em 0;
display: block;
} .pure-form input[type="text"][disabled],
.pure-form input[type="password"][disabled],
.pure-form input[type="email"][disabled],
.pure-form input[type="url"][disabled],
.pure-form input[type="date"][disabled],
.pure-form input[type="month"][disabled],
.pure-form input[type="time"][disabled],
.pure-form input[type="datetime"][disabled],
.pure-form input[type="datetime-local"][disabled],
.pure-form input[type="week"][disabled],
.pure-form input[type="number"][disabled],
.pure-form input[type="search"][disabled],
.pure-form input[type="tel"][disabled],
.pure-form input[type="color"][disabled],
.pure-form select[disabled],
.pure-form textarea[disabled] {
cursor: not-allowed;
background-color: #eaeded;
color: #cad2d3;
} /*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form input:not([type])[disabled] {
cursor: not-allowed;
background-color: #eaeded;
color: #cad2d3;
}
.pure-form input[readonly],
.pure-form select[readonly],
.pure-form textarea[readonly] {
background: #eee; /* menu hover bg color */
color: #777; /* menu text color */
border-color: #ccc;
} .pure-form input:focus:invalid,
.pure-form textarea:focus:invalid,
.pure-form select:focus:invalid {
color: #b94a48;
border-color: #ee5f5b;
}
.pure-form input:focus:invalid:focus,
.pure-form textarea:focus:invalid:focus,
.pure-form select:focus:invalid:focus {
border-color: #e9322d;
}
.pure-form input[type="file"]:focus:invalid:focus,
.pure-form input[type="radio"]:focus:invalid:focus,
.pure-form input[type="checkbox"]:focus:invalid:focus {
outline-color: #e9322d;
}
.pure-form select {
border: 1px solid #ccc;
background-color: white;
}
.pure-form select[multiple] {
height: auto;
}
.pure-form label {
margin: 0.5em 0 0.2em;
}
.pure-form fieldset {
margin:;
padding: 0.35em 0 0.75em;
border:;
}
.pure-form legend {
display: block;
width: 100%;
padding: 0.3em 0;
margin-bottom: 0.3em;
color: #333;
border-bottom: 1px solid #e5e5e5;
} .pure-form-stacked input[type="text"],
.pure-form-stacked input[type="password"],
.pure-form-stacked input[type="email"],
.pure-form-stacked input[type="url"],
.pure-form-stacked input[type="date"],
.pure-form-stacked input[type="month"],
.pure-form-stacked input[type="time"],
.pure-form-stacked input[type="datetime"],
.pure-form-stacked input[type="datetime-local"],
.pure-form-stacked input[type="week"],
.pure-form-stacked input[type="number"],
.pure-form-stacked input[type="search"],
.pure-form-stacked input[type="tel"],
.pure-form-stacked input[type="color"],
.pure-form-stacked select,
.pure-form-stacked label,
.pure-form-stacked textarea {
display: block;
margin: 0.25em 0;
} /*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form-stacked input:not([type]) {
display: block;
margin: 0.25em 0;
}
.pure-form-aligned input,
.pure-form-aligned textarea,
.pure-form-aligned select,
/* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
.pure-form-aligned .pure-help-inline,
.pure-form-message-inline {
display: inline-block;
*display: inline;
*zoom:;
vertical-align: middle;
}
.pure-form-aligned textarea {
vertical-align: top;
} /* Aligned Forms */
.pure-form-aligned .pure-control-group {
margin-bottom: 0.5em;
}
.pure-form-aligned .pure-control-group label {
text-align: right;
display: inline-block;
vertical-align: middle;
width: 10em;
margin: 0 1em 0 0;
}
.pure-form-aligned .pure-controls {
margin: 1.5em 0 0 10em;
} /* Rounded Inputs */
.pure-form input.pure-input-rounded,
.pure-form .pure-input-rounded {
border-radius: 2em;
padding: 0.5em 1em;
} /* Grouped Inputs */
.pure-form .pure-group fieldset {
margin-bottom: 10px;
}
.pure-form .pure-group input {
display: block;
padding: 10px;
margin:;
border-radius:;
position: relative;
top: -1px;
}
.pure-form .pure-group input:focus {
z-index:;
}
.pure-form .pure-group input:first-child {
top: 1px;
border-radius: 4px 4px 0 0;
}
.pure-form .pure-group input:last-child {
top: -2px;
border-radius: 0 0 4px 4px;
}
.pure-form .pure-group button {
margin: 0.35em 0;
} .pure-form .pure-input-1 {
width: 100%;
}
.pure-form .pure-input-2-3 {
width: 66%;
}
.pure-form .pure-input-1-2 {
width: 50%;
}
.pure-form .pure-input-1-3 {
width: 33%;
}
.pure-form .pure-input-1-4 {
width: 25%;
} /* Inline help for forms */
/* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
.pure-form .pure-help-inline,
.pure-form-message-inline {
display: inline-block;
padding-left: 0.3em;
color: #666;
vertical-align: middle;
font-size: 0.875em;
} /* Block help for forms */
.pure-form-message {
display: block;
color: #666;
font-size: 0.875em;
} @media only screen and (max-width : 480px) {
.pure-form button[type="submit"] {
margin: 0.7em 0 0;
} .pure-form input:not([type]),
.pure-form input[type="text"],
.pure-form input[type="password"],
.pure-form input[type="email"],
.pure-form input[type="url"],
.pure-form input[type="date"],
.pure-form input[type="month"],
.pure-form input[type="time"],
.pure-form input[type="datetime"],
.pure-form input[type="datetime-local"],
.pure-form input[type="week"],
.pure-form input[type="number"],
.pure-form input[type="search"],
.pure-form input[type="tel"],
.pure-form input[type="color"],
.pure-form label {
margin-bottom: 0.3em;
display: block;
} .pure-group input:not([type]),
.pure-group input[type="text"],
.pure-group input[type="password"],
.pure-group input[type="email"],
.pure-group input[type="url"],
.pure-group input[type="date"],
.pure-group input[type="month"],
.pure-group input[type="time"],
.pure-group input[type="datetime"],
.pure-group input[type="datetime-local"],
.pure-group input[type="week"],
.pure-group input[type="number"],
.pure-group input[type="search"],
.pure-group input[type="tel"],
.pure-group input[type="color"] {
margin-bottom:;
} .pure-form-aligned .pure-control-group label {
margin-bottom: 0.3em;
text-align: left;
display: block;
width: 100%;
} .pure-form-aligned .pure-controls {
margin: 1.5em 0 0 0;
} /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
.pure-form .pure-help-inline,
.pure-form-message-inline,
.pure-form-message {
display: block;
font-size: 0.75em;
/* Increased bottom padding to make it group with its related input element. */
padding: 0.2em 0 0.8em;
}
} /*csslint adjoining-classes:false, outline-none:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/ .pure-menu ul {
position: absolute;
visibility: hidden;
} .pure-menu.pure-menu-open {
visibility: visible;
z-index:;
width: 100%;
} .pure-menu ul {
left: -10000px;
list-style: none;
margin:;
padding:;
top: -10000px;
z-index:;
} .pure-menu > ul { position: relative; } .pure-menu-open > ul {
left:;
top:;
visibility: visible;
} .pure-menu-open > ul:focus {
outline:;
} .pure-menu li { position: relative; } .pure-menu a,
.pure-menu .pure-menu-heading {
display: block;
color: inherit;
line-height: 1.5em;
padding: 5px 20px;
text-decoration: none;
white-space: nowrap;
} .pure-menu.pure-menu-horizontal > .pure-menu-heading {
display: inline-block;
*display: inline;
zoom:;
margin:;
vertical-align: middle;
}
.pure-menu.pure-menu-horizontal > ul {
display: inline-block;
*display: inline;
zoom:;
vertical-align: middle;
} .pure-menu li a { padding: 5px 20px; } .pure-menu-can-have-children > .pure-menu-label:after {
content: '\25B8';
float: right;
/* These specific fonts have the Unicode char we need. */
font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'DejaVu Sans', sans-serif;
margin-right: -20px;
margin-top: -1px;
} .pure-menu-can-have-children > .pure-menu-label {
padding-right: 30px;
} .pure-menu-separator {
background-color: #dfdfdf;
display: block;
height: 1px;
font-size:;
margin: 7px 2px;
overflow: hidden;
} .pure-menu-hidden {
display: none;
} /* FIXED MENU */
.pure-menu-fixed {
position: fixed;
top:;
left:;
width: 100%;
} /* HORIZONTAL MENU CODE */ /* Initial menus should be inline-block so that they are horizontal */
.pure-menu-horizontal li {
display: inline-block;
*display: inline;
zoom:;
vertical-align: middle;
} /* Submenus should still be display: block; */
.pure-menu-horizontal li li {
display: block;
} /* Content after should be down arrow */
.pure-menu-horizontal > .pure-menu-children > .pure-menu-can-have-children > .pure-menu-label:after {
content: "\25BE";
}
/*Add extra padding to elements that have the arrow so that the hover looks nice */
.pure-menu-horizontal > .pure-menu-children > .pure-menu-can-have-children > .pure-menu-label {
padding-right: 30px;
} /* Adjusting separator for vertical menus */
.pure-menu-horizontal li.pure-menu-separator {
height: 50%;
width: 1px;
margin: 0 7px;
} /* Submenus should be horizontal separator again */
.pure-menu-horizontal li li.pure-menu-separator {
height: 1px;
width: auto;
margin: 7px 2px;
} /*csslint adjoining-classes:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/ /* MAIN MENU STYLING */ .pure-menu.pure-menu-open,
.pure-menu.pure-menu-horizontal li .pure-menu-children {
background: #fff; /* Old browsers */
border: 1px solid #b7b7b7;
} /* remove borders for horizontal menus */
.pure-menu.pure-menu-horizontal,
.pure-menu.pure-menu-horizontal .pure-menu-heading {
border: none;
} /* LINK STYLES */ .pure-menu a {
border: 1px solid transparent;
border-left: none;
border-right: none; } .pure-menu a,
.pure-menu .pure-menu-can-have-children > li:after {
color: #777;
} .pure-menu .pure-menu-can-have-children > li:hover:after {
color: #fff;
} /* Focus style for a dropdown menu-item when the parent has been opened */
.pure-menu .pure-menu-open {
background: #dedede;
} .pure-menu li a:hover,
.pure-menu li a:focus {
background: #eee;
} /* DISABLED STATES */
.pure-menu li.pure-menu-disabled a:hover,
.pure-menu li.pure-menu-disabled a:focus {
background: #fff;
color: #bfbfbf;
} .pure-menu .pure-menu-disabled > a {
background-image: none;
border-color: transparent;
cursor: default;
} .pure-menu .pure-menu-disabled > a,
.pure-menu .pure-menu-can-have-children.pure-menu-disabled > a:after {
color: #bfbfbf;
} /* HEADINGS */
.pure-menu .pure-menu-heading {
color: #565d64;
text-transform: uppercase;
font-size: 90%;
margin-top: 0.5em;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #dfdfdf;
} /* ACTIVE MENU ITEM */
.pure-menu .pure-menu-selected a {
color: #000;
} /* FIXED MENU */
.pure-menu.pure-menu-open.pure-menu-fixed {
border: none;
border-bottom: 1px solid #b7b7b7;
} /*csslint box-model:false*/
/*TODO: Remove this lint rule override after a refactor of this code.*/ .pure-paginator { /* `pure-g` Grid styles */
letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
*letter-spacing: normal; /* reset IE < 8 */
*word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */ /* `pure-paginator` Specific styles */
list-style: none;
margin:;
padding:;
}
.opera-only :-o-prefocus,
.pure-paginator {
word-spacing: -0.43em;
} /* `pure-u` Grid styles */
.pure-paginator li {
display: inline-block;
*display: inline; /* IE < 8: fake inline-block */
zoom:;
letter-spacing: normal;
word-spacing: normal;
vertical-align: top;
text-rendering: auto;
} .pure-paginator .pure-button {
border-radius:;
padding: 0.8em 1.4em;
vertical-align: top;
height: 1.1em;
}
.pure-paginator .pure-button:focus,
.pure-paginator .pure-button:active {
outline-style: none;
}
.pure-paginator .prev,
.pure-paginator .next {
color: #C0C1C3;
text-shadow: 0 -1px 0 rgba(0,0,0, 0.45);
}
.pure-paginator .prev {
border-radius: 2px 0 0 2px;
}
.pure-paginator .next {
border-radius: 0 2px 2px 0;
} @media (max-width: 480px) {
.pure-menu-horizontal {
width: 100%;
} .pure-menu-children li {
display: block;
border-bottom: 1px solid black;
}
} .pure-table {
/* Remove spacing between table cells (from Normalize.css) */
border-collapse: collapse;
border-spacing:;
empty-cells: show;
border: 1px solid #cbcbcb;
} .pure-table caption {
color: #000;
font: italic 85%/1 arial, sans-serif;
padding: 1em 0;
text-align: center;
} .pure-table td,
.pure-table th {
border-left: 1px solid #cbcbcb;/* inner column border */
border-width: 0 0 0 1px;
font-size: inherit;
margin:;
overflow: visible; /*to make ths where the title is really long work*/
padding: 0.5em 1em; /* cell padding */
}
.pure-table td:first-child,
.pure-table th:first-child {
border-left-width:;
} .pure-table thead {
background: #e0e0e0;
color: #000;
text-align: left;
vertical-align: bottom;
} /*
striping:
even - #fff (white)
odd - #f2f2f2 (light gray)
*/
.pure-table td {
background-color: transparent;
}
.pure-table-odd td {
background-color: #f2f2f2;
} /* nth-child selector for modern browsers */
.pure-table-striped tr:nth-child(2n-1) td {
background-color: #f2f2f2;
} /* BORDERED TABLES */
.pure-table-bordered td {
border-bottom: 1px solid #cbcbcb;
}
.pure-table-bordered tbody > tr:last-child td,
.pure-table-horizontal tbody > tr:last-child td {
border-bottom-width:;
} /* HORIZONTAL BORDERED TABLES */ .pure-table-horizontal td,
.pure-table-horizontal th {
border-width: 0 0 1px 0;
border-bottom: 1px solid #cbcbcb;
}
.pure-table-horizontal tbody > tr:last-child td {
border-bottom-width:;
}

pure.css的更多相关文章

  1. Pure.css网格系统学习心得——图片的响应式以及应用填充和边框网格单位的学习

    今天学习了pure.css可定制的网格系统,pure默认的网格系统是移动先行,如果我们想在小屏幕上有网格只要用pure-u-*就可以了,下面来说一下它的主要用法! <div class=&quo ...

  2. Pure Css 菜单的使用

    本人新手,之前偶尔接触Bootstrap,也做过一些响应式开发,但是都是略显皮毛,公司的业务需求也限制了深入学习. 现着手Pure Css学习,尝试了简单的左边菜单自动隐藏的demo.闲话少说,代码贴 ...

  3. Pure CSS 的网格布局(比bootstrap小很多且易扩展的css UI)

    (转自百度经验)http://jingyan.baidu.com/article/48a42057c44fdba9242504dd.html Pure是一个简单.实用的CSS框架,鉴于目前网上对pur ...

  4. [SCSS] Pure CSS for multiline truncation with ellipsis

    1. Pure CSS 2. Responsive 3. No need to recalculate on resize or font’s load event 4. Cross browser

  5. Pure CSS Progress Chart

    Pure CSS Progress Chart CSS Progress Circle SCSS .example { text-align: center; padding: 4em; } .pie ...

  6. pure CSS waterfall layout

    pure CSS waterfall layout 纯 CSS 瀑布流布局 flex layout .container{} .item{} https://caniuse.com/?search=c ...

  7. pure css兼容IE

    <!--[if lte IE 8]> <link rel="stylesheet" href="pure/0.5.0/grids-responsive- ...

  8. pure.css 学习记录

    兼容性记录: IE 8+ Latest Stable: Firefox, Chrome, Safari iOS 6-8 Android 4.x 处理兼容性 <!--[if lte IE 8]&g ...

  9. pure css简单组件,借鉴bootstrap

    <!doctype html> <html> <head> <meta http-equiv="Content-type" content ...

随机推荐

  1. android app性能优化大汇总(google官方Android性能优化典范 - 第2季)

    Google前几天刚发布了Android性能优化典范第2季的课程,一共20个短视频,包括的内容大致有:电量优化,网络优化,Wear上如何做优化,使用对象池来提高效率,LRU Cache,Bitmap的 ...

  2. Collection 和 Collections的区别。

    Collection 和 Collections的区别. Collections是个java.util下的类,它包含有各种有关集合操作的静态方法. Collection是个java.util下的接口, ...

  3. iOS开发中遇到的头文件找不到的问题解决办法

    有时会遇到莫名其妙的明明有这个文件,但是就是显示头文件找不到,我也是咨询了技术大牛之后知道的这个方法,之后恰巧我一个朋友问我cocoapod加进去之后头文件找不到,我就让他试了下这个方法果然好用,我也 ...

  4. MVC为模型增加正则表达式

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA0sAAACJCAIAAABy7jQDAAAVTUlEQVR4nO3dv640yVnH8bmJvQpLBI

  5. 理解C#系列 / 核心C# / 枚举

    枚举 如果没有枚举 //1代表s号:2代表m号:3代表l号:4代表XL号:5代表XXL号 ; ){ //快递发M号的衣服 } 有了枚举之后 声明枚举(请原谅我使用了中文汉字) public enum ...

  6. AMQ学习笔记 - 10. Spring-JmsTemplate之浏览

    概述 浏览只是针对Queue的概念,Topic没有浏览.浏览是指获取消息而消息依然保持在broker中,而消息的接收会把消息从broker中移除. 浏览可以用来实现对Queue中消息的监控. JMS ...

  7. HashSet和LinkedHashSet特点.

    1)::HashSet-------(内部为HashCode表数据结构)---(保证数据唯一,但不保证数据有序) 不对数据进行排序,只是通过hashCode和equal对数据进行相同判定,如果相同就不 ...

  8. Rhythmbox中文乱码解决办法

    今天在网络上找到了一个比较好的解决Rhythmbox中文乱码的问题的方法 进入你的音乐文件夹执行如下代码: mid3iconv -e GBK *.mp3 如果没有提示多试几次,有可能系统会提示: py ...

  9. 2_1我的第一个应用hello world[wp8特色开发与编程技巧]

    2_1hello world -5min 大家好,我是徐文康,在上一个视频当中我们已经讲了,如何根据自己电脑系统去下载相应的SDK. 你可能花了很多时间去安装以及配置好了这个开发环境,如果还没有配置好 ...

  10. linux查看硬件信息

    1,查看CPU信息:cat /proc/cpuinfo2,查看板卡信息:cat /proc/pci3,查看USB设备:cat /proc/bus/usb/devices4,查看PCI信息:lspci ...