HTML and CSS Reference
In-Depth Information
@mixin gradient($start, $stop, $degrees) {
background: rgba($start, 1);
background: -moz-linear-gradient($degrees, $start 0%, $stop 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,
$start), color-stop(100%, $stop));
background: -o-linear-gradient($degrees, $start 0%,$stop 100%);
background: -ms-linear-gradient($degrees, $start 0% $stop 100%);
background: linear-gradient($degrees, $start 0%, $stop 100%);
}
You may have seen this mixin from the previous chapter. It simply creates CSS
gradients for vendor specific gradient code. It's a little bit more complex than
the other mixins as each vendor at the time of writing has their own
implementation for CSS gradients, which makes accepting a single value and
passing it to the vendor properties impossible.
Creating the Partials
With the mixins created, it's now time to create the partials. As explained before,
the partials will help to separate different parts of your CSS into different files
without impacting on your end user by using the traditional @import in regular
CSS files, which have a big impact on load time.
You can begin by opening the empty _reset.scss file in the partials directory.
You do not have to manually type the code below into this SASS file, you can
copy it from Eric Mayar's website
listed below just for your reference.
v2.0b1 | 201101
NOTE: WORK IN PROGRESS
USE WITH CAUTION AND TEST WITH ABANDON */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
