background preloader

Home of free code snippets for Bootstrap

https://bootsnipp.com/

Related:  HTML/CSS

Aide mémoire pour Bootstrap Twitter Bootstrap est une collection d'outils utile à la création de sites web et applications web. C'est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option.Cette plate-forme a été conçue par deux développeurs faisant partie de la mouvance de développeurs qui gravitent autour de Twitter, Mark Otto et Jacob Thornton (@mdo et @fat).Ce site utilise un modèle basé sur Bootstrap. Cette page a pour objectif de lister les différents éléments gérés par Bootstrap pouvant être intégrés dans les pages et les articles utilisant ce modèle. La page est divisée en 12 colonnes.Pour écrire sur deux colonnes : <div class="row"><div class="col-lg-6"> Première colonne </div><div class="col-lg-6"> Deuxième colonne </div></div> Première colonne

Datatable projet Voici un tableau utilisant le plugin DatatTables, qui permet d'être filtré grâce à trois listes déroulantes pour le filtrage par le jour, le mois et l'année. Les listes déroulantes sont entiérements créées en PHP, et chargées via la base de données. Chacune des listes déroulantes possèdent sa propre requête SQL issu du champ en timestamps, mais en utilisant le code suivant (SELECT DISTINCT FROM_UNIXTIME(datefichier,"%d") AS day). Le format de la date dans le champ MySQL est de type (timestamp) (int 11). Votre site en Responsive design grâce à Foundation, Knacss ou Bootstrap - Vous souhaitez coder un site internet qui s’adapte parfaitement à la largeur des écrans de vos internautes ? Il faudrait peut être penser à utiliser un framework CSS responsive design ! Voici une sélection des 4 meilleurs : Foundation, Bootstrap, Gumby et Knacss.

Apprendre à créer une grille Bootstrap Twitter Le système de grille est le coeur de BOOTSTRAP twitter. Bootstrap Twitter considère qu'une ligne .row fait 12 colonnes. L'idée d'un responsive design c'est de dire que pour telle taille d'écran un élément occupe X colonne(s). Boostrap Devices Bootstrap twitter prend en charge 4 types de format: Il existe un préfixe pour ces formats: TinyMCE – Documentation fr pour bien démarrer Remise à jour d’une documentation pour l’outil TinyMCE l’éditeur WYSIWYG très utilisé sur le web. C’est une documentation en français et pour les novices. Cet un article qui fait suite à une constatation suite à la réadaptation d’un de mes blogs. Tutoriel : Bootstrap de Twitter : un kit CSS et plus ! Version en ligne Table des matières Bootstrap de Twitter : un kit CSS et plus ! Vous créez des pages web et vous passez beaucoup de temps avec le CSS ? Alors Bootstrap est fait pour vous et ce cours va vous guider dans la découverte de cette puissante boîte à outil.

Bootstrap de Twitter : un kit CSS et plus ! Version en ligne Table des matières Bootstrap de Twitter : un kit CSS et plus ! Un confirm javascript avec le BsHelper Un peu d'UX (expérience utilisateur) En plus d'intégrer des composants de Twitter Bootstrap dans un helper, nous avons réfléchi à leur utilisation dans nos interfaces. Il est en effet important dans une application que le design soit au service de l'expérience. Nous utilisons donc les éléments de Twitter Bootstrap pour créer une expérience utilisateur intéressante et qui aura un rendu similaire dans tous les navigateurs. Cet article traite du confirm() javascript que nous avons souhaité revoir car nous ne le considérons pas comme optimal pour les utilisateurs. Il propose en effet une interface terne, qui diffère d'un navigateur à l'autre.

Related:  WEBDESIGNnickleusjQuery MiscTwitter BootstrapFrame Works#+#+alessiocangemiBootstrap\-o_o-/Code Snippets for WebBootstrapBOOTSTRAPBootstrapAstuces, trucs, techniques utiles...bootstrap