Homework Help is Here – Start Your Trial Now!
Engineering
Computer Science
CSS Requirements Create three break points using media queries in at least one style sheet to alter the way your website looks on small, medium and large devices • it will help to view your current website on a mobile device and document what looks broken (overflow, small text, etc) • start coding media queries after identifying elements of your website that need responsive behavior Each style sheet must have at least 25 unique CSS selectors. Your selectors must satisfy the requirements below: • 1x Universal Selector • >= 1 x Type Selector • >= 1x Class Selector • >= 1x ID Selector • >= 1x Group Selector (ex: h1, p, a {/*styles here*/}) • >= 2 x Child Selector • >= 2 x General Sibling Combinator (-) • >= 2 x Adjacent Sibling Combinator (+) • >= 2 x Pseudo Class Selector (ex: :nth-of-type) There must be at least one Grid layout and one Flex layout on your website • Grid style requirements: • grid-template-areas • grid-template-columns grid-template-rows • grid-area • Flex style requirements: • flex-direction (can be set to row our column) • flex-wrap • flex-basis • flex-grow - you must have one item that grows more than other flex items given available space! • flex-shrink - you must have one item that shrinks more than other flex items given available space! Create at least one transition on page

CSS Requirements Create three break points using media queries in at least one style sheet to alter the way your website looks on small, medium and large devices • it will help to view your current website on a mobile device and document what looks broken (overflow, small text, etc) • start coding media queries after identifying elements of your website that need responsive behavior Each style sheet must have at least 25 unique CSS selectors. Your selectors must satisfy the requirements below: • 1x Universal Selector • >= 1 x Type Selector • >= 1x Class Selector • >= 1x ID Selector • >= 1x Group Selector (ex: h1, p, a {/*styles here*/}) • >= 2 x Child Selector • >= 2 x General Sibling Combinator (-) • >= 2 x Adjacent Sibling Combinator (+) • >= 2 x Pseudo Class Selector (ex: :nth-of-type) There must be at least one Grid layout and one Flex layout on your website • Grid style requirements: • grid-template-areas • grid-template-columns grid-template-rows • grid-area • Flex style requirements: • flex-direction (can be set to row our column) • flex-wrap • flex-basis • flex-grow - you must have one item that grows more than other flex items given available space! • flex-shrink - you must have one item that shrinks more than other flex items given available space! Create at least one transition on page

Database System Concepts
Database System Concepts
7th Edition
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Chapter1: Introduction
Section: Chapter Questions
Problem 1PE
See similar textbooks
icon
Related questions
Question
CSS Requirements Create three break points using media queries in at least one style sheet to alter the way your website looks on small, medium and large devices o it will help to view your current website on a mobile device and document what looks broken (overflow, small text, etc) o start coding media queries after identifying elements of your website that need responsive behavior Each style sheet must have at least 25 unique CSS selectors. Your selectors must satisfy the requirements below: • 1x Universal Selector • >= 1x Type Selector o >= 1 x Class Selector o >= 1 x ID Selector • >= 1x Group Selector (ex: h1, p, a {/*styles here*/}) • >= 2 x Child Selector o >= 2 x General Sibling Combinator (~) o >= 2 x Adjacent Sibling Combinator (+) • >= 2 x Pseudo Class Selector (ex: :nth-of-type) There must be at least one Grid layout and one Flex layout on your website • Grid style requirements: - grid-template-areas grid-template-columns • grid-template-rows • grid-area • Flex style requirements: . flex-direction (can be set to row our column) • flex-wrap • flex-basis . flex-grow - you must have one item that grows more than other flex items given available space! • flex-shrink - you must have one item that shrinks more than other flex items given available space! Create at least one transition on page
Transcribed Image Text:CSS Requirements Create three break points using media queries in at least one style sheet to alter the way your website looks on small, medium and large devices o it will help to view your current website on a mobile device and document what looks broken (overflow, small text, etc) o start coding media queries after identifying elements of your website that need responsive behavior Each style sheet must have at least 25 unique CSS selectors. Your selectors must satisfy the requirements below: • 1x Universal Selector • >= 1x Type Selector o >= 1 x Class Selector o >= 1 x ID Selector • >= 1x Group Selector (ex: h1, p, a {/*styles here*/}) • >= 2 x Child Selector o >= 2 x General Sibling Combinator (~) o >= 2 x Adjacent Sibling Combinator (+) • >= 2 x Pseudo Class Selector (ex: :nth-of-type) There must be at least one Grid layout and one Flex layout on your website • Grid style requirements: - grid-template-areas grid-template-columns • grid-template-rows • grid-area • Flex style requirements: . flex-direction (can be set to row our column) • flex-wrap • flex-basis . flex-grow - you must have one item that grows more than other flex items given available space! • flex-shrink - you must have one item that shrinks more than other flex items given available space! Create at least one transition on page
CSS Requirements Separate your style sheets into three /styles/colors.css /styles/formatting.css /styles/transitions-animations.css
Transcribed Image Text:CSS Requirements Separate your style sheets into three /styles/colors.css /styles/formatting.css /styles/transitions-animations.css
Expert Solution
steps

Step by step

Solved in 3 steps with 2 images

SEE SOLUTIONCheck out a sample Q&A here
Blurred answer
Knowledge Booster
Properties of CSS
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.
Similar questions
Recommended textbooks for you
Database System Concepts
Database System Concepts
Computer Science
ISBN:
9780078022159
Author:
Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:
McGraw-Hill Education
Starting Out with Python (4th Edition)
Starting Out with Python (4th Edition)
Computer Science
ISBN:
9780134444321
Author:
Tony Gaddis
Publisher:
PEARSON
Digital Fundamentals (11th Edition)
Digital Fundamentals (11th Edition)
Computer Science
ISBN:
9780132737968
Author:
Thomas L. Floyd
Publisher:
PEARSON
C How to Program (8th Edition)
C How to Program (8th Edition)
Computer Science
ISBN:
9780133976892
Author:
Paul J. Deitel, Harvey Deitel
Publisher:
PEARSON
Database Systems: Design, Implementation, & Manag…
Database Systems: Design, Implementation, & Manag…
Computer Science
ISBN:
9781337627900
Author:
Carlos Coronel, Steven Morris
Publisher:
Cengage Learning
Programmable Logic Controllers
Programmable Logic Controllers
Computer Science
ISBN:
9780073373843
Author:
Frank D. Petruzella
Publisher:
McGraw-Hill Education
SEE MORE TEXTBOOKS