recentpopularlog in

piperh : examples   61

One Page Love - One Page Website Inspiration and Templates
a site dedicated to single-page designs. Also has articles and templates
webdesign  web  design  onepage  single  page  inspiration  examples  gallery 
12 weeks ago by piperh
Examples | Responsive Web Design
inspiration pages of the Responsive Design Weekly site
webdesign  web  design  inspiration  examples  websites  responsive  gallery 
12 weeks ago by piperh
10 HTML Elements You Didn't Know You Needed - DEV Community 👩‍💻👨‍💻
some unusual html tags. Some of the code in the article is slipshod, and the code is in images not copyable, but there are useful examples
webdesign  web  design  html  tags  examples  video  audio  time  template  meter  progress  picture  output  blockquote 
march 2019 by piperh
CSS Layout cookbook - CSS: Cascading Style Sheets | MDN
a few css recipes for commonly used items or patterns, using flex or grid
webdesign  web  design  layout  components  css  flex  grid  recipes  examples  flexbox 
october 2018 by piperh
Grid by Example - Usage examples of CSS Grid Layout
Everything you need to learn CSS Grid Layout.

gridbyexample.com is a Rachel Andrew project
webdesign  web  design  css  grid  learning  learn  examples  reference 
june 2018 by piperh
CSS Arrows From CodePen - Freebie Supply
collection of (some animated) css arrows from codepen. Possibly useful for speed - grab a bit code so as not to figure out angles by trial and error
webdesign  web  design  css  codepen  arrows  css-only  examples  code 
february 2018 by piperh
eases - graph - clickable
codepen demo of many different bezier easings. I couldn't see a way to copy the actual numbers, but there are small graphic representations of the curves.
webdesign  web  design  bezier  ease  curve  easing  animation  css  transition  examples 
january 2018 by piperh
Basic concepts of flexbox - CSS | MDN
another page dedicated to flexbox, but has useful live working examples for playing with. By Rachel Andrew
webdesign  web  design  flex  flexbox  examples  live  test  display  layout 
november 2017 by piperh
Discover the Power of CSS Transforms - Heart Internet Blog - Focusing on all aspects of the web
blog of UK hosting company: "Discover the Power of CSS Transforms". Useful article with lots of code, about using css transforms
webdesign  web  design  css  transform  translate  examples  code  coding  tips  inspiration 
september 2017 by piperh
The Ultimate Guide to Flexbox — Learning Through Examples
A tutorial on flexbox building 7 example page layouts. Includes building forms with flex.
webdesign  web  design  layout  flex  flexbox  css  examples  page 
september 2017 by piperh
Guide to building layouts with CSS Grid
A collection of resources & tools to help you manage the Grid
webdesign  web  design  css  grid  layout  guide  resources  examples  page  site 
september 2017 by piperh
Get Started with Grid Layout
site by Rachel Andrew all about css grid, very thorough. Videos, code, examples
webdesign  web  design  grid  layout  resource  reference  examples  css 
may 2017 by piperh
jQuery Modal
interesting looking modal, with useful options
webdesign  web  design  jquery  javascript  examples  howto  code  modal  window  dialogue 
january 2017 by piperh
14 jQuery Modal Dialog Boxes
some jquery (and a couple of vanilla) modals, updated late 2016
webdesign  web  design  modal  dialogue  window  popup  jquery  js  javascript  script  examples 
january 2017 by piperh
styles for Nicolas Hoffman simple modal animated
within styles search for: STYLES FOR MODAL WINDOWS, EXAMPLES. Shows his css styles for animating his modal window examples. The page about his modal is here: https://a11y.nicolas-hoffmann.net/modal/
nicolas  hoffman  css  modal  simple  animated  styles  examples  window 
january 2017 by piperh
Compressive images in Perch - Perch CMS documentation
Perch docs page explaining image tags to use to generate compressive images
webdesign  web  design  cms  perch  image  compressive  responsive  tag  density  quality  sharpen  examples  howto  template 
december 2016 by piperh
Fonts In Use – Type at work in the real world.
They say: An independent archive of typography. Menus categorised by 'Industries', 'Formats' (media type), 'Typeface'
web  graphic  design  font  typography  inspiration  usage  examples  type  typeface  archive 
june 2016 by piperh
Flexbox - a Collection by Bermon Painter on CodePen
simple codepen examples of different flexbox uses
webdesign  web  design  css  flex  flexbox  examples 
june 2016 by piperh
Using CSS flexible boxes - CSS | MDN
mozilla page introducing flexbox, with some and examples.
webdesign  web  design  flex  flexbox  css  examples  modules  code  coding  layout  reference 
june 2016 by piperh
Flexbox Patterns
a few handy examples, with code, of flexbox use especially for components of the final page. eg, within the header
webdesign  web  design  flex  flexbox  css  examples  modules  code  coding 
june 2016 by piperh
Experiment: Using Flexbox Today - Chris Wright
page with multi-choice working examples to demo the use of flex
webdesign  web  design  flex  flexbox  howto  tutorial  demo  examples  css 
february 2016 by piperh
The Shapes of CSS
great collection of non square shapes achieved only in css. Very handy code showing how to get triangle pointers using border. (I'd always wondered how it was done)
webdesign  web  design  css  shapes  code  coding  howto  examples  non-square  triangle  border 
november 2015 by piperh
CSS Filters Demo
demo of css photoshop-like filters in css
webdesign  web  design  css  filter  property  demo  demonstration  examples  opacity  blur 
september 2015 by piperh
Stu Nicholls | CSSplay
lots of menus and drop-downs and so on, but test anything from here very carefully, there are some strange design and functionality decisions
design  webdesign  web  css  html  code  resources  tips  resource  templates  examples  menus  gallery  xhtml  layout  menu  responsive 
january 2010 by piperh

Copy this bookmark:





to read