Wir fügen einige Responsivität zum Grid hinzu, das wir für die Galerie eingerichtet haben. Auf den breitesten Bildschirmen haben wir es auf vier Spalten eingestellt. Dann beginnen wir, Breakpoints über unsere super einfach eingerichteten und wiederverwendeten @mixins hinzuzufügen.
An unserem "Mama-Bär"-Breakpoint gehen wir auf 3 Spalten, dann fügen wir einen Zwischen-Breakpoint zwischen "Mama-Bär" und "Baby-Bär" ein, wo es in 2 Spalten übergeht, und schließlich 1 Spalte bei "Baby-Bär". Das ist super einfach, da wir nur anpassen müssen, wie viele Spalten wir über CSS3 column-count einstellen.
Am Ende des Videos sprechen wir über zukünftige Ziele für die Galerie. Es wäre schön, unterschiedliche Anzahlen von Bildern auf verschiedenen Bildschirmgrößen laden zu können und tatsächliche Thumbnails anstelle von Bildern in voller Größe zu verwenden. Vielleicht erreichen wir das eines Tages.
Zu Ihrer Information: Die Software, die ich lokal verwende, um Screenshots aufzunehmen und sie per FTP auf den Server hochzuladen, ist LittleSnapper.
Hallo, welche App verwenden Sie für Bildschirmmessungen?
Auf einem Mac können Sie einfach Command-Shift-4 drücken, um das Screenshot-Tool zu erhalten, das Ihnen auch die Abmessungen des ausgewählten Bereichs anzeigt.
Danke.
Wo werden diese Bilder gespeichert? LOL Ich bin neu auf Mac.
Die Bilder werden standardmäßig auf Ihrem Desktop gespeichert.
Ich frage mich, ob ein Teil des Ruckelns daran liegt, dass Bilder inline sind. Ich weiß, dass die divs inline-block sind, aber vielleicht würden die Spalten die Bilder besser als Blockelemente handhaben? Einfach, weil Spalten mit Inline-Elementen umgehen.
Chris, in Ihrem Dock befinden sich zwei Apps, die mir nicht bekannt sind, und ich kann sie einfach nicht herausfinden. Ich glaube, ich habe den Rest davon richtig beschriftet? :) Ich liebe die Videos und lerne gerne mehr über die verschiedenen Apps, die Sie verwenden.
Total Finder
1Password
Font Explorer X Pro
iTunes
Adium
Skype
Busycal
Things?
Safari
Chrome
Opera
Firefox
iOS Simulator
Transmit
???
Coda 2
Sublime Text 2
Tower
iTerm2
MAMP Pro
Sequel Pro
Codekit
Illustrator
Fireworks
Photoshop
Keynote
Skitch
Little Snapper
ScreenFlow
Preview
iPhoto
Quickbooks/Quicken?
???
Starcraft
Die fehlenden sind
http://glyphsapp.com/
und
http://tapbots.com/software/tweetbot/mac/ (sieht jetzt anders aus, es war damals in der Beta)