Successfully reported this slideshow.
Your SlideShare is downloading. ×

Generative Art with FizzBuzz in CSS

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 45 Ad
Advertisement

More Related Content

Recently uploaded (20)

Advertisement

Generative Art with FizzBuzz in CSS

  1. 1. for( var i = 0; i <= 100; i++ ) { if ( i % 5 == 0 && i % 3 == 0 ) { console.log( 'fizzbuzz'); } else if ( i % 3 == 0 ) { console.log( 'fizz'); } else if ( i % 5 == 0 ) { console.log( 'buzz'); } else { console.log( i ); } }
  2. 2. div { counter-increment: fizzbuzz; } div::after { content: counter(fizzbuzz); } div:nth-child(3n)::before { content: 'Fizz'; } div:nth-child(3n)::after { content: ''; } div:nth-child(5n)::after { content: 'Buzz'; }
  3. 3. What is A Programming Language? By Will Chrichton
  4. 4. for( var i = 0; i <= 100; i++ ) { if ( i % 5 == 0 && i % 3 == 0 ) { console.log( 'fizzbuzz'); } else if ( i % 3 == 0 ) { console.log( 'fizz'); } else if ( i % 5 == 0 ) { console.log( 'buzz'); } else { console.log( i ); } }
  5. 5. div { counter-increment: fizzbuzz; } div::after { content: counter(fizzbuzz); } div:nth-child(3n)::before { content: 'Fizz'; } div:nth-child(3n)::after { content: ''; } div:nth-child(5n)::after { content: 'Buzz'; }
  6. 6. for( var i = 0; i <= 100; i++ ) { if ( i % 5 == 0 && i % 3 == 0 ) { console.log( 'fizzbuzz'); } else if ( i % 3 == 0 ) { console.log( 'fizz'); } else if ( i % 5 == 0 ) { console.log( 'buzz'); } else { console.log( i ); } }
  7. 7. div { counter-increment: fizzbuzz; } div::after { content: counter(fizzbuzz); } div:nth-child(3n)::before { content: 'Fizz'; } div:nth-child(3n)::after { content: ''; } div:nth-child(5n)::after { content: 'Buzz'; }

×