ICT Q2 L1-L4 Flashcards
Indicates the typeface.
font-family
Indicates if the text is written in italics, obliquely, or normal
font-style
Indicates the thickness of the characters
font-weight
Indicates the size of the text.
font-size
Is used to do small-caps within a text
element.
font-variant
Indicates the alignment.
text-align
Indicates the decoration applied.
text-decoration
Indicates the case of the text.
text-transform
Indicates the line spacing taken up by each line.
line-height
Indents the first line of each paragraph
text-indent
link your html with css
<link rel=”stylescheet” href=”cssname.css” type=text/css”>
THE ________ IS ESSENTIALLY A ___ THAT WRAPS AROUND
EVERY HTML ELEMENT
box model
*THE BOX MODEL CONSISTS OF
MARGINS
*BORDERS
*PADDING
*AND THE ACTUAL CONTENT
TEXT AND IMAGES APPEAR
Content
CLEARS AN AREA AROUND THE CONTENT
PADDING
GOES AROUND THE PADDING AND
CONTENT.
Border
CLEARS AN AREA OUTSIDE THE BORDER.
MARGIN
WILL ALLOW YOU TO CONTROL WHERE A SPECIFIED
BLOCK ELEMENT WILL BE LOCATED OR PLACED ON THE PAGE AND
WHERE THE OTHER ELEMENTS WILL BE POSITIONED IN RELATION TO
THE SAID BLOCK.
Float
Set color to a
specific value (bg)
Background-color
Set the background
to the image
selected by the URL (bg)
Background-image
Repeats background
(default)
Background-repeat:
Repeats background
horizontally
repeat-x
Repeats background
vertically
Repeat-y
Does not repeat the
background
No repeat
BACKGROUND CAN BE LOCATED WHERE THE IMAGE WILL BE POSITIONED ON THE WEB PAGE BY SPECIFYING A CERTAIN VALUE OR A
KEYWORD LOCATION.
Background-position
THIS PROPERTY ALLOWS YOU TO CONTROL HOW THE BACKGROUND
SCROLLS WITH THE WEBPAGE
Background-attachment:
Background scrolls
with document
(default)
scroll
Background is steady
and does not follow
scroll action.
fixed
THE ________ PROPERTY SPECIFIES WHAT KIND OF BORDER
TO DISPLAY.
BORDER-STYLE
DEFINES A DOTTED BORDER
Dotted
- DEFINES A DASHED BORDER
Dashed
- DEFINES A SOLID BORDER
Solid
DEFINES A DOUBLE BORDER
Double
DEFINES A 3D GROOVED BORDER. THE EFFECT DEPENDS ON THE BORDER-COLOR
VALUE
Groove
- DEFINES A 3D RIDGED BORDER. THE EFFECT DEPENDS ON THE BORDER-COLOR VALUE
Ridge
DEFINES A 3D INSET BORDER. THE EFFECT DEPENDS ON THE BORDER-COLOR VALUE
Inset
DEFINES A 3D OUTSET BORDER. THE EFFECT DEPENDS ON THE BORDER-COLOR
VALUEOu
Outset
- DEFINES NO BORDER
None
THE ______ PROPERTY ALLOWS YOU TO SPECIFY THE
WIDTH OF A BORDER
Border-width:
THE PROPERTY ALLOWS YOU TO SPECIFY THE
COLOR OF A BORDER.
BORDER COLOR
IT IS USED TO SPECIFY THE BORDER THICKNESS, STYLE AND COLOR
OF AN HTML ELEMENT IN A SINGE LINE.
BORDER SHORTHAND
Value of border shorthand
BORDER-WIDTH, BORDER-STYLE, BORDER-COLOR;
- SPECIFY AN IMAGE AS THE BORDER AROUND AN
ELEMENT.
BORDER IMAGE
This property is fundamental in the border image shorthand as it defines how the image
is divided and used for the border.
BORDER-IMAGE-SLICE
is a CSS property
that specifies how the parts of an image
used for a border (as defined by border image-slice) are fitted or repeated around
the border of an element.
BORDER-IMAGE-REPEAT
The border image is ______ to fill the
border space. This
might distort the
image if the border
is much larger than
the image slice
Border-image-repeat: stretch
The border image is
tiled (repeated) to
cover the border. If
the image is too
small, it repeats as
needed, sometimes
cutting off part of the
image.
Border-image-repeat: repeat
Similar to repeat, but
the image is scaled
to fit the border area
perfectly without
being cut off.
Border-image-repeat: round
The image is
repeated like in
repeat, but with
extra space added
between slices to fit
the border area
without resizing the
image.
Border-image-repeat: space
THE PROPERTY DEFINES THE RADIUS OF
THE ELEMENT’S CORNERS.
BORDER RADIUS
FOUR VALUES
TOP-LEFT
CORNER, TOP-RIGHT CORNER, BOTTOM RIGHT CORNER, BOTTOM-LEFT CORNER
Inverse C
THREE VALUES
FIRST VALUE APPLIES TO TOP-LEFT
CORNER, SECOND VALUE APPLIES TO TOP-RIGHT AND BOTTOM-LEFT CORNERS, AND THIRD
VALUE APPLIES TO BOTTOM-RIGHT CORNER)
letter Z
TWO VALUES
TO TOP-LEFT AND
BOTTOM-RIGHT CORNERS, AND THE SECOND VALUE APPLIES TO TOP-RIGHT AND BOTTOMLEFT CORNERS)
LETTER X
ONE VALUE
All four corners
