Skip to main content

Home/ Web Development, Design & Programming/ Group items tagged css generator

Rss Feed Group items tagged

Jochen Burkhard

Mastering CSS Coding: Getting Started - Smashing Magazine - 13 views

  •  
    CSS has become the standard for building websites in today's industry. Whether you are a hardcore developer or designer, you should be familiar with it. CSS is the bridge between programming and design, and any Web professional must have some general knowledge of it. If you are getting your feet wet with CSS, this is the perfect time to fire up your favorite text editor and follow along in this tutorial as we cover the most common and practical uses of CSS.
  •  
    CSS has become the standard for building websites in today's industry. Whether you are a hardcore developer or designer, you should be familiar with it. CSS is the bridge between programming and design, and any Web professional must have some general knowledge of it. If you are getting your feet wet with CSS, this is the perfect time to fire up your favorite text editor and follow along in this tutorial as we cover the most common and practical uses of CSS.
Jochen Burkhard

Mastering CSS Coding: Getting Started - Smashing Magazine - 0 views

    • Jochen Burkhard
       
      A CSS-Primer one would dream of... Well done guys!
  • Quick tip: Because block elements typically span 100% of their parent container’s width, floating an element to the right knocks it down to the next line. This also applies to plain text that runs next to it because the floated element cannot squeeze in the same line.
  • Reverse the order of the HTML markup
  • ...2 more annotations...
  • Specify an exact width for the neighboring element
  • To horizontally align non-textual elements, use the margin property.
  •  
    CSS has become the standard for building websites in today's industry. Whether you are a hardcore developer or designer, you should be familiar with it. CSS is the bridge between programming and design, and any Web professional must have some general knowledge of it. If you are getting your feet wet with CSS, this is the perfect time to fire up your favorite text editor and follow along in this tutorial as we cover the most common and practical uses of CSS.
awqi zar

40 Excellent (Yet Free) CSS Tools And Generators For Developers | Free and Useful Onlin... - 1 views

  •  
    For a developer, finding useful CSS tools is like finding a magic lamp that can make his toughest task a fun activity. CSS tools help developers in numbers of ways and let them create stylish, functional and optimized websites.In this post, we are showcasing a precious collection of 40 useful and powerful CSS tools and generators that save your time and energy while giving the best possible results. Take a look and feel free to share your comments with us.
Vernon Fowler

25+ Powerful CSS Tools & Generators for Designers and Developers - DesignModo - 4 views

  •  
    CSS technology is extensively used in the website designing and the CSS tools can be helpful in creating HTML newsletters and for various multiple purposes. Finding a good CSS tool could be daunting task for the designers but now there are multiple of tools available for creating stylish and optimized websites.
Anton S.

SelectorGadget: point and click CSS selectors - 0 views

  •  
    "SelectorGadget is an open source bookmarklet that makes CSS selector generation and discovery on complicated sites a breeze. Just drag the bookmarklet to your bookmark bar, then go to any page and press it. A box will open in the bottom right of the website. Click on a page element that you would like your selector to match (it will turn green). SelectorGadget will then generate a minimal CSS selector for that element, and will highlight (yellow) everything that is matched by the selector. Now click on a highlighted element to remove it from the selector (red), or click on an unhighlighted element to add it to the selector. Through this process of selection and rejection, SelectorGadget helps you come up with the perfect CSS selector for your needs."
  •  
    You can dating in here. This is a best site dating www.sugarhoneys4u.com www.killdo.de.gg
tom studer

10 of the Best CSS3 Code Generators » SitePoint - 0 views

  •  
    CSS3 changes everything. There are 116 new properties* with multiple vendor prefixes and different syntaxes. No one could be expect you to memorize everything. Fortunately, there are a number on free online tools which will help you create modern CSS3 code to cut and paste into your stylesheets…
Luciano Ferrer

Top 4 Free CSS Generators Online - Sepia River: theCreativeflow - 1 views

  •  
    "http://css3generator.com/ » The drop-down list says "Choose Something". Choices include: shadows, transitions, even transform and @font-face! It has an option for border-radius, but if that's the only thing you need, there's the quick and dirty: http://border-radius.com/ » Super simple, uber-easy-to-use, just does border-radius. What more can I say? http://www.colorzilla.com/gradient-editor/ » Sleek, Photoshop-like gradient editor that spits out cross-browser CSS. Fancy - with live preview and the like. Resist the urge to add gradients to everything you do. http://www.cssbuttongenerator.com/ » Comes with some nice default palettes, but fully customizable with your own color values. Sleek color-picker and sliders to make it how you want it, plus a link to a more advanced button generator. I've definitely been making more buttons since this baby came online :)"
Aline Ohannessian

Free CSS Sprite Image Generators | Design Marketing Advertising Free Tips - 8 views

  •  
    .."4 awesome CSS Sprite image generators, all free and extremely useful when designing your next website.."
mithun biswas

create your own website for free - 0 views

  •  
    create your own website for free without having coding knowledge by using css3 gradient generator all Text, box, radius, shadow and Icons etc
DJ XC

CSS Border Radius - 0 views

  •  
    herramienta para crear código css para border-radius
  •  
    Handy tool for generating browser-specific and general css3 border-radius statements
Vernon Fowler

A design process revealed | stopdesign - 1 views

  • I began by studying the content (text) of the existing page, making a model in my head of the document flow and hierarchy. I aggregated the sections of the page into logical groupings and assigned each a priority. I also spent time thinking about the purpose of the project, along with the ideas and concepts Dave Shea was trying to communicate when he created the Garden space and opened it up for other designers to contribute.
  • Showing off advanced CSS trickery is not the goal of this project. Instead, it attempts to demonstrate the beauty and flexibility achievable when designers grasp all the potential of CSS, using it as a tool to create a well-designed aesthetically-pleasing page which remains accessible, well-structured, and efficiently coded.
  • My Garden lists contained groupings of words and thoughts related to gardening, plants and flowers found in a garden, zen-like qualities, beauty and beautiful things, and characteristics of page design. I also created lists of all the elements, IDs, and classes used in Dave’s HTML, some of which made subtle appearances in the final design.
  • ...11 more annotations...
  • Once I exhausted the idea branching, I started drawing thumbnail sketches
  • Once I had a few rough compositions I liked, I began studying typefaces and letterforms.
  • In addition to my affinity for the letterforms, the pronounced medieval style of the headline type created a perfect contrast with the sans-serif modernity of supporting keywords and titles which I set in Helvetica.
  • My next step in the process was to research imagery which could be used as the foundation for background texture, and act as supporting visual content.
  • I tend to keep imagery confined to a particular region of the layout, or reserve it for a specific purpose. In my opinion, the overuse of photography or illustration can quickly create a crowded, chaotic design which just obscures the intention or message of the piece. Contrast is an element of design which I love to work with when creating anything visual. This comes just as much into play with use of imagery in a composition as it does within the image itself. Effectively integrating imagery into a design requires an awareness of balance and tension. Compact areas of motion and activity, countered with spaces for the eye to rest and relax.
  • When designing outside HTML and CSS, I focus on constructing the language and guidelines of the page, determining proportions, widths and heights, gutters and white space, specifying complementing typefaces, choosing relative type size and leading, and the application of color as a means of both obvious and subtle accent.
  • I started writing the CSS for the design at a high-level, focusing on the layout structure, major backgrounds, and large regions of the page.
  • Groups of elements were positioned in correct locations. Then I applied the necessary detail to each element, from the top of the page, down.
  • The addition of a background pattern to the left and right of the primary image was an added benefit of discovering I couldn’t position the header as I originally intended.
  • The vertical alignment wasn’t refined until after each column was already positioned on the page.
  • This unity of thought at the final stage of the process is a strong reason the designer and person responsible for generating the HTML and/or CSS need should be working together as closely as possible, if the two are not already the same person.
Jungle Jar

JungleJar | A Closer Look at CSS Tab Designer - 0 views

  •  
    Do you ever find yourself sitting in front of Photoshop for hours trying to mock up a decent navigation menu, or searching the web for the most aesthetically pleasing color palettes for your users to click on that doesn't remind them of McDonalds or a funeral parlor? Face it, sometimes we all lose our mojo for a moment or two, and then we are forced to validate ourselves not just to the W3C, but also to our website visitors, design clients and portfolio piranhas. And then we remember that through the general kindness of a group of web designers and/or developers, and through organizations such as The Creative Commons who work to guarantee that kind freedom, we don't always have to be the Picaso of style sheets.
Vernon Fowler

Best Practices for Speeding Up Your Web Site - 1 views

  • Arranging the images in the sprite horizontally as opposed to vertically usually results in a smaller file size. Combining similar colors in a sprite helps you keep the color count low, ideally under 256 colors so to fit in a PNG8. "Be mobile-friendly" and don't leave big gaps between the images in a sprite. This doesn't affect the file size as much but requires less memory for the user agent to decompress the image into a pixel map. 100x100 image is 10 thousand pixels, where 1000x1000 is 1 million pixels
  • Minification is the practice of removing unnecessary characters from code to reduce its size thereby improving load times. When code is minified all comments are removed, as well as unneeded white space characters (space, newline, and tab). In the case of JavaScript, this improves response time performance because the size of the downloaded file is reduced.
  • Many web sites fall in the middle of these metrics. For these sites, the best solution generally is to deploy the JavaScript and CSS as external files. The only exception where inlining is preferable is with home pages, such as Yahoo!'s front page and My Yahoo!. Home pages that have few (perhaps only one) page view per session may find that inlining JavaScript and CSS results in faster end-user response times. For front pages that are typically the first of many page views, there are techniques that leverage the reduction of HTTP requests that inlining provides, as well as the caching benefits achieved through using external files. One such technique is to inline JavaScript and CSS in the front page, but dynamically download the external files after the page has finished loading. Subsequent pages would reference the external files that should already be in the browser's cache.
  • ...1 more annotation...
  • CSS Sprites are the preferred method for reducing the number of image requests. Combine your background images into a single image and use the CSS background-image and background-position properties to display the desired image segment.
Jochen Burkhard

Tiny Fluid Grid - 0 views

  •  
    Inspired by 1kbgrid.com. Developed with love by Girlfriend's overconfident and pretty good looking team of web developers. Tiny Fluid Grid ships with a index.html with demo code, and the grid.css containing the CSS for the grid you created.
Vernon Fowler

Ultimate CSS Gradient Generator - 2 views

  •  
    A powerful Photoshop-like CSS gradient editor from ColorZilla.
1 - 20 of 90 Next › Last »
Showing 20 items per page