background preloader

CSS3 Box Shadow Generator - CSS3gen

CSS3 Box Shadow Generator - CSS3gen
Use this CSS3 box shadow generator to quickly generate box shadow CSS for your project. Your browser does not support the CSS3 box-shadow property. You can still use this tool to generate the CSS3 rule, but you won't be able to see the results. <div class="error_msg">Please enable Javascript to use this page.</div> Box Shadow Explained The CSS3 box-shadow property allows you to add depth to your website's design without the need for images or extra container elements. While the syntax is easy to understand, it is hard to visualise the style using just code. The box-shadow syntax works as follows: The first value defines the distance of the box shadow in the x (horizontal) direction and the second value defines the distance in the y (vertical) direction. Optionally you can include an additional parameter after the blur distance: This defines the spread distance of the shadow. Supporting Browsers

Related:  CSScssCSS & Sass Tita CréaAdornmentsWeb Development

untitled Table of Contents Usage Using Hamburgers for your site is easy (well, that was my intention anyway). Sass CSS3 Hidden Social Buttons Today we’ll be looking at some very simple techniques using CSS3 transforms to make social link buttons. Usually you’ll see these links all over a site sitting there making a site look ugly. With this technique, we’ll style our buttons with our own CSS, and then let the like/follow/+1 button appear on hover. This ensures that our site can stay clean and good looking. Enough talk. Let’s look at the demos and see how we can create each one. A Mega Guide to Learning and Referencing CSS for WordPress: 150+ Resources When it comes to learning and remembering CSS, there’s no reason why you need to commit every property and class to memory when you can quickly look up anything you need to know in just a few seconds. But while search engines (read: Google) offer a quick way to search for CSS answers, it can be difficult to know which ones are actually helpful and, more importantly, up-to-date. In our recent member survey we asked you what your biggest hurdle is in learning WordPress and an overwhelming number of you said you wanted to level up your coding skills and become more proficient in HTML, CSS and PHP.

Blur.js Take II - A post from jakiestfu To view Demos and to download, view the post here. Some time has passed since I wrote my hack plugin blur.js, and i thought I'd play around with the concept again, but in a different way. jQuery is required, and so is a modern browser. 10 LESS CSS Examples You Should Steal for Your Projects LESS, Sass and other CSS preprocessors represent an awesome way to extend CSS to be everything a programmer ever wanted. Variables, mathematical operations, mixins and a lot more make these tools invaluable to coders who can appreciate the benefits of typing less while accomplishing more. One of the most major hurdles to getting started with these tools is simply figuring out just what the heck you’re going to do with them.

Responsive Autorun Slideshow Date : 12th January 2015 For all the latest browsers, Android and iOS Information A basic responsive autorun slideshow for all the latest browsers and operating systems including touch screens. reveal.js - The HTML Presentation Framework HTML Presentations Made Easy Created by Hakim El Hattab / @hakimel Heads Up reveal.js is a framework for easily creating beautiful presentations using HTML. Sass: Sass Basics Before you can use Sass, you need to set it up on your project. If you want to just browse here, go ahead, but we recommend you go install Sass first. Go here if you want to learn how to get everything setup.