background preloader

CSS3 Tools and Snippets

CSS3 Tools and Snippets

21 outils et générateurs CSS pour développeurs web Les générateurs et outils CSS sont de plus en plus nombreux sur la toile, et facilitent la tâche des développeurs web en leur faisant gagner un gain de temps considérable, en particulier ceux qui génèrent du CSS3. Voici une liste non exhaustive de 21 ressources CSS à connaître et à tester dès maintenant ! 1. Bear CSS Bear CSS est un service qui permet de générer une feuille de style à partir d’un code HTML en prenant en compte les éléments et le balisage de la structure du document (id et classes CSS). 2. CSS Type Set est un service qui permet de gérer la mise en forme d’un texte dans une interface simple et intuitive. 3. Border Radius est un générateur déstiné uniquement à la propriété CSS3 border-radius qui permet de créer des coins arrondis sur un élément HTML. 4. 5. 6. 7. CSS3 Please est probablement l’un des tous meilleurs générateurs CSS3. 8. 9.

HTML Beautifier Online HTML Beautifier tool can process an html document and reformat it with a correct indentation of tags and syntax highlighting. By applying HTML beautifies to your HTML code will improve the layout and indent style of the resulting HTML code. When an html document is edited is very easy to mess the code making it unreadable. Especially if you use many nested DIVs (or even worse nested TABLEs) it can become difficult to remember how the document is structured. HTML Beautifier will help you to solve many of these problems. Beautification involves using white spaces like tabs and line-breaks to indent HTML code. This online tool will not fix your invalid tags. Online HTML Beautifier Information: Purpose of this Tool : HTML Beautifier, HTML Formatting, HTML Tags Formatting, Improve the HTML layout and indent style, HTML Tidy, Unpack HTML, Human Readable HTML, De-Obfuscate HTML Intended Audience : Webmasters, Web Developers, Website Designers, Programmers External Resources:

10 générateurs de backgrounds et favicons Même si on a l’habitude de travailler avec un logiciel d’édition graphique, il peut être parfois plus rapide de récupérer et personnaliser des patterns de design déjà existants. Et si en plus des sites spécialisés vous permettent de le faire gratuitement, rapidement, et en toute légalié, pourquoi se priver ? Vous pouvez fermer Photoshop : Même si on a l’habitude de travailler avec un logiciel d’édition graphique, il peut être parfois plus rapide de récupérer et personnaliser des patterns de design déjà existants. Et si en plus des sites spécialisés vous permettent de le faire gratuitement, rapidement, et en toute légalié, pourquoi se priver ? Vous pouvez fermer Photoshop : voici 10 générateurs pour vos backgrounds et vos favicons. Générateurs de Backgrounds 1. Permet de réaliser des fonds striés et de télécharger votre création afin de l’utiliser dans un projet. 2. Idem, avec un fonctionnement très semblable. 3. 4. Pour dessiner des motifs de style tartan. 5. 6. Générateurs de favicons 1. 2.

Online JavaScript beautifier Themes for Twitter Bootstrap - WrapBootstrap About Bootstrap Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex. Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples. Built to support new HTML5 elements and syntax with progressively enhanced components. Browser support Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer. Chrome 14+ Safari 5 Firefox 5+ Internet Explorer 7/8/9 Opera 11

Touch Responsive & Bootstrap WordPress Theme Download the update version 2.1 Touch Twitter Bootstrap – Responsive WP Theme. Unlimited combinations on any page. Subscribe for Updates Updates, release dates, free stuff, and much more, just drop your email in the box and we will keep you up-to-date with latest news from Themeple. Subscribe to get updates One Click Demo Data Install! Mobile Demo Theme Options Page Builder Hundreds of Shortcodes 3 Responsive Slider All The Google Web Fonts Responsive Theme Make Gradients and use Color picker for everything Design with Boxes and Columes Major Features Themeple FrameworkPage BuilderBootstrapTrue ResponsiveiPhone/iPad compatibleUnlimited Layout for creatives and business websitesPortfolio display with category filter Grid or List View4 Portfolio layouts with category filter3 Custom made SlidersCustom made contact formCustom Designed layoutsMulti-category projectsPresent Identity, Motion, Web, Print, Photo projects and more! Make Your Layout All Responsive Sliders Need Support? Updates Credits

noty - A jQuery Notification Plugin Hi! noty is a jQuery plugin that makes it easy to create alert - success - error - warning - information - confirmation messages as an alternative the standard alert dialog. Each notification is added to a queue. (Optional) The notifications can be positioned at the: top - topLeft - topCenter - topRight - center - centerLeft - centerRight - bottom - bottomLeft - bottomCenter - bottomRight The API provides lots of other options to customise the text, animation, speed, buttons and much more. It also has various callbacks for the buttons such as opening and closing the notifications and queue control. Layouts & Demos Top Alert Success Error Warning Information Confirm TopLeft Alert Success Error Warning Information Confirm TopCenter Alert Success Error Warning Information Confirm TopRight Alert Success Error Warning Information Confirm CenterLeft Alert Success Error Warning Information Confirm Center Alert Success Error Warning Information Confirm Installation Try!

SpraedPDFGeneratorBundle by stedekay SpraedPDFGeneratorBundle generates HTML documents to PDF. The bundle gives you the chance to add a page header and footer very easily (which can be disabled/switched on the first page). It works with a little jar library based on the Flying Saucer project . So you need to run Java on your server (Java 6 or higher). ToDo Write a little example how to enable header and footer Writing tests (test frame available for UnitTests) Check for possibilities to use SVG files in HTML Installation Option 1: Use composer Option 2: Use git submodules Copy the SpraedPDFGeneratorBundle into the vendor/bundles/Spraed/PDFGeneratorBundle directory: git submodule add vendor/bundles/Spraed/PDFGeneratorBundle Option 3: Use deps file [SpraedPDFGeneratorBundle] git= target=/bundles/Spraed/PDFGeneratorBundle Register the Spraed namespace: $loader->registerNamespaces(array( ... Usage Copyright (C) 2012 stedekay

Tutoriel pour améliorer vos applications Symfony2 Ce tutoriel fait suite à l'article intitulé "Créer sa première application web en PHP avec Symfony2" au cours duquel vous avez pu découvrir le framework Symfony2 et ses grands principes de fonctionnement. Si vous ne l'avez pas encore lu, je vous invite à le parcourir dès maintenant car nous allons poursuivre le développement de l'application "Filmothèque" créée précédemment. Au cours de cet article, nous allons voir comment améliorer notre application pour parvenir à un site web complet et prêt à être mis en ligne. Nous travaillerons sur la mise en page grâce à l'héritage des templates Twig, à l'insertion d'images et de styles CSS. Ce tutoriel est basé sur la version finale Symfony2.0.0 que vous pouvez télécharger ici : Symfony2. II-A. Comme nous l'avons vu lors du tutoriel précédent, Twig permet d'insérer du texte et d'intégrer des variables issues de PHP grâce à l'utilisation de doubles accolades (ex : {{ mon_message }}). II-B. II-C. II-D. // ...

Related: