Video icon 64
Learn to Code. Start your free trial today.
Advertisement

CSS

  • Web Development
    Creating a WordPress Theme From Static HTML: Creating Template FilesCreating wordpress theme from html 400
    60 shares
    In the first part of this series, I showed you how to prepare your HTML and CSS files for WordPress, ensuring the structure would work, the code was valid and that the correct classes were being used. In this tutorial you'll learn how to take your index.html file and split it up into a set of template files for use by WordPress.Read More…
  • HTML & CSS
    AbsurdJS or Why I Wrote My Own CSS PreprocessorAbsurd 400
    29 shares
    As a front-end developer, I'm writing a lot of CSS and using pure CSS is not the most efficient way nowadays. CSS preprocessors are something which have helped me a lot. My first impression was that I finally found the perfect tool. These have a bunch of features, great support, free resources and so on. This is all true and it still applies, but after several projects, I realized that the world is not so perfect. There are two main CSS preprocessors - LESS and SASS. There are some others, but I have experience with only these two. In the first part of this article I'll share with you what I don't like about preprocessors and then in the second part I'll show you how I managed to solve most of the problems that I had.Read More…
  • Laravel
    Authentication With Laravel 4Laravel 4 auth retina preview
    85 shares
    Authentication is required for virtually any type of web application. In this tutorial, I'd like to show you how you can go about creating a small authentication application using Laravel 4. We'll start from the very beginning by creating our Laravel app using composer, creating the database, loading in the Twitter Bootstrap, creating a main layout, registering users, logging in and out, and protecting routes using filters. We've got a lot of code to cover, so let's get started!Read More…
  • Web Development
    Mobile First With Bootstrap 3Bootstrap 3 preview
    152 shares
    Ok so a couple of weeks now, on it's very own two year anniversary Mark Otto and the rest of the guys responsible for the develop and maintenance of Bootstrap announced the official release of the framework's third version, and it came on steroids, let's see what we're getting.Read More…
  • HTML & CSS
    Pure: What, Why, & How?Pure retina preview
    380 shares
    This tutorial will introduce you to Pure, a CSS library made of small modules, that can help you in writing completely responsive layouts, in a very fast and easy way. Along the way, I'll guide you through the creation of a simple page in order to highlight how you can use some of the library's components.Read More…
  • Creative Coding
    Working with Classes and IDs Generated By WordPressWordpress generated classes ids preview image 400
    27 shares
    A helpful feature of WordPress is the way it generates classes and IDs. Some of these are generated by the system itself, while in other cases you insert some PHP in your theme and WordPress uses that to add classes and IDs to the page markup.Read More…
  • Theme Development
    Creating an Image-Based Archive Page: StylingCreating an image based archive page
    12 shares
    In Part 1 of this tutorial you learned how to create a template file for a custom post type in order to display featured images and titles for each post. You registered a custom post type of ‘animal' and created a file called archive-animal.php to display an archive of animals. In this tutorial you'll learn the CSS required to add a grid layout to the images and overlay post titles over the images. You'll then learn how to add a hover effect, so the name of the animal only appears when the user hovers their mouse over each image.Read More…
  • Theme Development
    Building a Mobile First Responsive WordPress ThemeBuilding a mobile first responsive wordpress theme
    20 shares
    Theme building is at the heart of WordPress. It's the technique you use to build bespoke websites for yourself or your clients and it's a vital skill for anyone wanting to design and develop with WordPress. More and more WordPress themes now are responsive - they use CSS media queries to adapt to different screen widths, adjusting the layout and making design and interface changes to make any site created using the theme easier to read and interact with on a range of devices and screen sizes. In this tutorial I'm going to show you how to build a Mobile First WordPress theme, which starts with the styling for the smallest screens and works upwards.Read More…
  • HTML & CSS
    Build a Twitter Clone From Scratch: The DesignPreview
    51 shares
    This article represents the first in a new group effort by the Nettuts+ staff, which covers the process of designing and building a web app from scratch - in multiple languages! We'll use a fictional Twitter-clone, called Ribbit, as the basis for this series. In this tutorial, we need to focus on the UI. We'll leverage the popular LESS Preprocessor to make our CSS as manageable as possible.Read More…
  • HTML & CSS
    A First Look at the HTML5 History APIPreview
    103 shares
    HTML5 introduces a variety of new goodies for front-end developers, such as the additions to the browser's history object. Let's take a look at its new features in this lesson.Read More…
  • WordPress
    Quick Tip: How to Code a Scrolling Navigation BarPreview
    11 shares
    So you've seen them on other people's websites and you want to know how you can have one too? The scrolling navigation menu seen on many websites is really easy to replicate in WordPress. Help your readers out, let them click the menu from any point on the page. Here's how...Read More…
  • HTML & CSS
    Responsive Grids With SusySuzy
    32 shares
    Are you happy with with any of the CSS grid libraries available? No? I don't blame you. Enter Susy, a plugin for the Compass CSS framework that lets you create your own custom grid framework, minimizing overhead, while making it more understandable to use. Sounds good, right? Let's jump right in. Read More…
Advertisement
Suggested Tuts+ Course
Chrome Developer Tools$15
Advertisement