CSS
Get flash to fully experience Pearltrees
The 30 CSS Selectors you Must Memorize
This entry is part 2 of 16 in the CSS3 Mastery Session - Show All « Previous Next » Twice a month, we revisit some of our readers’ favorite posts from throughout the history of Nettuts+. This tutorial was first published in November, 2010. So you learned the base id , class , and descendant selectors – and then called it a day? If so, you’re missing out on an enormous level of flexibility. While many of the selectors mentioned in this article are part of the CSS3 spec, and are, consequently, only available in modern browsers, you owe it to yourself to commit these to memory.
Tabs
See the demo page for the finished version of the code. In this example, we'll look at using CSS to build a tabbed display. One where the user can click on individual tabs to view different content within the same space. It will require a few lines of JavaScript to dynamically update the individual tabs but we'll cover that code later. For now, we'll look at building the display.Once resources have been downloaded to the client, the browser still needs to load, interpret, and render HTML, CSS, and JavaScript code. By simply formatting your code and pages in ways that exploit the characteristics of current browsers, you can enhance performance on the client side. Use efficient CSS selectors Overview
Optimize browser rendering
Lately I've been playing around with CSS3 and discovered some new CSS tricks. Did you know you can make a round circle with border-radius and create inner shadow effect with box-shadow inset? Check out this beautiful search form demo that I've created with CSS gradient , border-radius, and box-shadow. It displays perfect in CSS3 browsers and degrades gracefully in non-CSS3 browsers. View Demo Search Form
Beautiful CSS3 Search Form
50 Useful Tools and Generators for Easy CSS Development
The tools have been sorteds into the following categories: Grid and Layout, CSS Optimisers, CSS Menus Tools, CSS Buttons, CSS Rounded Corners, CSS Frames, CSS Sprites, CSS Tables, CSS Typography and CSS Forms. Grid and Layout Tools and Generators The 1KB CSS Grid Pin It This is a fresh take on the CSS grid. It can be used to streamline page templates for content management systems, its mission is to be lightweight.
Showcase of 40 useful and powerful CSS tools and generators. These tools can really relieve developers work in many ways – I understand you like always to do everything by yourself but it’s not the best way in the most cases, because it really takes time and such liberty we don’t always have. This is considered to be really complete list about everything CSS related, as CSS lover myself I really evaluate good automated ways so I can focus on things I enjoy the most – creating elegant, usable and optimized website!
40 Powerful CSS Tools And Generators To Automate Your Workflow
Advanced CSS Menu
Last tutorial, I showed you how to design a watercolor effect menu in Photoshop. This tutorial I will show you how to slice up the menu design (step by step) and put them together with CSS. Most of you probably know how to code a horizontal or vertical CSS list menu. Now let's take it to the next level — code an advanced (un-typical) list menu utilizing the CSS position property. View Demo CSS menu
