Use CSS3 in applications (25%) Flashcards
Why do HTML elements usually appear differently in different browsers?
The browsers are applying different default styles
Which CSS property is used to specify the text color?
color
What three ways can you specify a color for the CSS color property?
hex, color name, and rgb values
h1 { color:#00FF00; } h2 { color: green; } h3 { color: rgb(0,255,0); }
How do you make text appear in bold?
Set the CSS font-weight property to bold.
p {
font-weight: bold;
}
What values can be specified for the CSS font-weight property?
lighter, normal, bold and bolder
or
100 (lighter), 200, 300, 400, 500, 600, 700, 800, 900 (darker)
How do you make text appear in italics?
Set the CSS font-weight property to italic.
p {
font-style:italic;
}
How do you specify the font to use for text?
Set the CSS font-family property.
p {
font-family:Arial,’Times New Roman’,Webdings;
}
How do you use a font that may not be installed on the client?
Add a @font-face rule and provide a WOFF (Web Open Font Format) for download.
@font-face { font-family: "My Nicer Font"; src: url('fonts/my_woff_font.eot'); src: url('fonts/my_woff_font.woff'); }
p {
font-family: ‘My Nicer Font’;
}
How do you change the size of text relative to the default text size of the browser?
Set the CSS font-size property to one of these values: xx-small, x-small, smaller, small, medium, large, larger, x-large, and xx-large.
p {
font-size: x-large;
}
How do you change the horizontal alignment for text?
Set the CSS text-align property.
p {
text-align: center;
}
What are the possible values for the CSS text-align property (other than initial and inherit)?
left, center, right, justify
What does the value initial for a CSS property signify?
That the property use its default value.
What does the value inherit for a CSS property signify?
That the property get its value from the parent element.
What CSS property is used to indent text?
text-indent
p {
text-indent: 50px;
}
What CSS property is used to change the amount of spacing between letters?
letter-spacing
p {
letter-spacing: 8px;
}
What CSS property is used to change the amount of spacing between words?
word-spacing
p {
word-spacing: 8px;
}
What CSS property is used to change how a sentence or word wraps or breaks at the end of the line?
hyphens
div {
hyphens: none;
}
What are the possible values for the CSS hyphens property?
none, auto, manual
What CSS properties are used to change an element’s size?
height and width
table {
height: 50%;
width: 50%;
}
div {
width: 200px;
height: 100px;
}
What CSS properties are used to change an element’s border?
border, border-style, border-color, border-spacing, border-width
p{ border-style: solid ; border-color: black; border-spacing: 250px; border-width: 5px; }
div {
border: 5px solid black;
}
What is the order that values must be specified for the CSS border property?
size style color
div {
border: 5px solid black;
}
What is the space surrounding an element outside its border called?
margin
What is the space inside an element’s border surrounding its content called?
padding
From inside to outside, what are the CSS properties that affect the spacing of elements?
padding, border, margin
Lorem Ipsum ...
Lorem Ipsum ...
Lorem Ipsum ...
Lorem Ipsum ...