+ All Categories
Home > Documents > By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6...

By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6...

Date post: 19-Aug-2020
Category:
Upload: others
View: 0 times
Download: 0 times
Share this document with a friend
16
By Dr Derek Peacock
Transcript
Page 1: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

By Dr Derek Peacock

Page 2: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

Borders – rounded corners Backgrounds – multiple images Colour – Opacity and gradients Text – Shadows & Web Fonts Box – Shadows Transformations & Transitions Media Queries – size and aspect ratios

Page 3: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

http://html5test.com/

Page 4: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 5: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

http://caniuse.com/

Page 6: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

border-radius

Page 7: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 8: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 9: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

border-radius: 0px 0px 20px 20px;border-radius: 20px;

Page 10: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 11: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 12: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

http://www.colorzilla.com/gradient-editor/

Page 13: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 14: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,
Page 15: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

header h1{

text-shadow: 2px 2px rgba(0, 0, 0, 0.5);}

Page 16: By Dr Derek Peacockvalerianweb.com/tutor/Assets/CSS/CSS3_ProgressiveEnhancement.pdf · HTML6 JavaScript 735 Flattr Index gdChoices Tables css HTML5 Canvas Demo Search: border-radius,

Recommended