Articles > CSS

CSS

Introduction to Sass

I recently completed a seven part series on Learning LESS, and we had a lot of commenters who requested a similar series on Sass (Syntactically Awesome Stylesheets). While there is a lot of discussion out there as to whether or not LESS or Sass is better, both have their place, both accomplish the same overall goal, and both can make your life (and your coding) much simpler and easier. What is Sass? ... Sass, which stands for Syntactically Awesome Stylesheets, is a "meta-language on top of CSS that’s...
CSS

Add Some Pizzazz to Your Text Boxes with HTML5 and CSS3

Most online text entry fields, including text boxes and search boxes, look exactly like the name implies -- very “boxy”. Relatively few website owners have availed themselves of the latest coding advances to incorporate subtle touches into their form elements to create an entirely new look. With HTML5 and CSS3, powerful, yet simple coding tools will now allow for speedy and effective appearance upgrades for all types of boxes. Say, for instance, you wanted to freshen up a simple multi-line text...
CSS

Designing Smartphone-Optimized Websites: Challenges Web Developers

Web developers are increasingly being asked to build sites that cater to smartphone Internet users, or to recast existing sites into user-friendlier formats for mobile devices. By 2015, statistical research by eMarketer predicts that more than half of the persons who access the Web will do so through a smartphone or other small-screen device. This paradigm shift represents a challenge to the established Web development community, which now has a mandate to configure Web content previously optimized...
CSS

Allowing Users to Resize Web Page Elements with CSS3

With CSS3 you can give your users a greater level of control over how they view your pages without having to employ complex JavaScript functions. Using the resize property in CSS3, you can set elements to be automatically resizable. These elements appear within the browser with a subtle indicator at the bottom right corner letting users know that the element is resizable. On clicking and dragging the corner, the user can resize your element. The resize property in itself is not complex, but can have...
CSS

Learning LESS: Using Functions

We continue on our journey of Learning LESS today as we take a look at Nested Rules in LESS, which will help you write extremely clean code. If you haven't read our first three posts on the topic, check out the introduction, variables, mixins and nested rules posts. Blog Series Roadmap ... An Introduction Using Variables Using Mixins Using Nested Rules Using Functions Divide and Conquer Put It Into Action Time to get our hands dirty in some LESS functions, which will likely blow your mind that it...
CSS

Learning LESS: Nested Rules

We continue on our journey of Learning LESS today as we take a look at Nested Rules in LESS, which will help you write extremely clean code. If you haven't read our first three posts on the topic, check out Learning LESS: An Introduction, Learning LESS: Variables and Learning LESS: Mixins. Blog Series Roadmap ... An Introduction Using Variables Using Mixins Using Nested Rules Using Functions Divide and Conquer Put It Into Action Now we jump into Nested Rules, a topic that can be somewhat difficult...
CSS

A Simple Way to Add Free News Content to Your Website Part 2

In the first part of this tutorial, detailed information was provided on utilizing RSS (Really Simple Syndication) coding to incorporate free news content and links into any web page. It is recommended that you review Pt. 1, because it explains more about RSS and reveals how to integrate a basic newsfeed module using Google Feed API. The goal of this tutorial is to furnish instructions on adding a larger news content module, a horizontal newsfeed, and a list-format style feed. Let’s get started....
CSS

Learning LESS: Mixins

We continue on our journey of Learning LESS today as we dig into an extremely powerful component of LESS: Mixins. If you haven't read our first two posts on the topic, check out Learning LESS: An Introduction and Learning LESS: Variables. Blog Series Roadmap ... An Introduction Using Variables Using Mixins Using Nested Rules Using Functions Divide and Conquer Put It Into Action So let's introduce LESS Mixins, and showcase some of what you can do with them. What is a Mixin? ... A Mixin in LESS is basically...
Load more
Home CSS Deals DesignBombs HTML HTML5 JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress