NEW
Font size
WorksheetsADV CSS Quiz 3
Total questions: 10
Worksheet time: 5mins
By default, the width and height of an element is calculated like this:
width + border = actual width of an element
height + border = actual height of an element
width = actual width of an element
height = actual height of an element
width + padding + border = actual width of an element
height + padding + border = actual height of an element
width + margin + border = actual width of an element
height + margin + border = actual height of an element
The CSS box-sizing property allows us to include the padding and border in an element's total width and height.
True
False
If you set box-sizing: border-box; on an element, padding and border are included in the width and height.
True
False
The @media rule, first introduced in CSS3, made it possible to define different style rules for different media types.
True
False
Fortunately media types got a lot of support by devices, except for the print media type.
True
False
Media queries in CSS3 extended the CSS2 media types idea: Instead of looking for a type of device, they look at the capability of the device.
True
False
There are many free CSS Frameworks that offer Responsive Design, which one is fake?
W3.CSS
Bootstrap
Semantic UI, Bulma, Materialize
LeatherWorx
You can't also use media queries to change the font size of an element on different screen sizes.
True
False
Which of these @media rules sets a break point to set the font size to 30px at a max 600px?
@media only screen and (min-width: 601px) { div.example { font-size: 80px;}}
@media only screen and (max-width: 600px) { div.example { display: none;}}
@media only screen and (max-width: 600px) { div.example { font-size: 30px;}}
@media only screen and (orientation: landscape) { body { background-color: lightblue; }}
