Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

HTML > HTML > Flashcards

HTML Flashcards

1
Q

Sizes for font-size

A

font-size: px / in / or cm;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

text-decoration:

A

none, underline, line-through, overline

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

a : hover { color: green; }

A

Styles link when the user hovers over.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

a : visited { color: red; }

A

Styles visited links

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Adjust Font Weight

A

font-weight: normal or bold;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Font Shorthand

A

font: weight / size / family
font: normal 28px Impact, fantasy;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Image Sizing

A

HTML: attribute within the img tag. height=”100” width=”100”

CSS: img { width: 100 px; } needs pixel

*if both are set, CSS overrides HTML

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Image border-styles

A

solid, dotted, dashed, double, groove, ridge, inset, outset, and none.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

border-width

A

Sets the width of the border.

border-width:20px;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

border-color

A

Need to set a border style before assigning a color.

border-color: gold;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Border shorthand

A

border: 4px dotted green;

width-style-color (can be put in any order)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Margin property

A

Used to add space around HTML elements.

margin or margin-top, -right, -bottom, -left

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Margin shorthand

A

margin: top right bottom left px;
margin: 10px; (sets all 4 sides)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Centering with auto margin

A

(1) Set width or container i.e. html { width:320px; }

(2) set margin as margin:0 auto;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

box-shadow

A

box-shadow: 5px 15px;

box-shadow: left-right / up-down

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

box-shadow color

A

Default is set as the same color as page text.

box-shadow: 5px 5px red;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Blur & Spread

A

box-shadow: x y blur spread;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

text-shadow

A

Same values as box shadow, but no spread value.
text-shadow: 3px 3px 5px blue;
(x y shadow position) (size & color of shadow)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Multiple Shadows

A

Add more than 1 text-shadow with lists separated by a comma.
text-shadow: -3px 0 red, 3px 0 cyan;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

Background-Image Property

A

background-image: url( ) ;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Transparent Background Images

A

background-color: red;
background-image: url( );
*Red color will show up if image is semi-transparent

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

Background Shorthand

A

Combines color and image.

background: hotPink url( );
* Order doesn’t matter

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

List-Style-Type

A

Styles the bullet

list-style-type: disk/square/circle/none;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

List-Style-Image

A

Replaces bullet with an image.

list-style-image: url ( );

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

Header/Footer/Section

A

Used to separate page into semantic sections.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

Text-Align

A

text-align: center/left/right/justify;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

Doctype

A

(!doctype html)

Put at the start of your code to tell the web browser your page uses HTML.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

Stylesheet Link

A

(link rel=”stylesheet” href=””)
Rel: Attribute sets the type of link it is.
Href: Attribute sets the link location.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

Comment Out Code

A

Surround elements with <!--this markup--> to hide, but easily bring back later.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

TODO Comments

A

Add reminders todo things later. Google Style Guide: <!--TODO: Put task here-->

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

CSS Comments

A

/This is a CSS Comment/

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

Margin

A

Adds space around the outside of an element.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

Padding

A

Adds space between the content and border.

34
Q

Overriding Rules

A

CSS - If 2 values are set for the same property, the last one is used.

35
Q

Display

A

Changes the display type. (Block - Inline - Inline-Block - None)

36
Q

display: block

A

Block elements drop below the previous element. Width and height are used. ( h1 - p )

37
Q

display: inline

A

Inline elements are displayed next to each other if there is space. Width and height are ignored. ( a - br )

38
Q

display: inline-block

A

Inline-block elements are displayed next to each other if there is space. Width and height are used. (img)

39
Q

display: none

A

Elements are not displayed on the page.

40
Q

Block Elements

A

Expand to the width of the page. Their height expands to fit the text and elements they contain.

41
Q

Inline Elements

A

Expand to the width and height of their contents. Their size cannot be changed with width and height CSS properties. Margin and padding will add space around an element. Only left and right margin and padding properties will change the position.

42
Q

Inline-Block Elements

A

Rules are a combination of block and inline. Change size and spacing with (width - height - margin - padding) They will sit on the same line if space allows.

43
Q

Width Property

A

Setting a width works for block elements, but not inline. Will work with inline elements if the display is set to block.

44
Q

Creating rounded corners

A

border-radius: 10px;

45
Q

Center elements

A

To center any block elements: Set the width and then the margins.
( width:250px; ) ( margin:10px auto; )

46
Q

RGB Color

A

color: rgb (0, 0, 0);

* Insert anywhere you would specify color

47
Q

Alpha RGB Color

A

Allows for semi-transparency.

rgba (0,0,0, .25)

48
Q

Alpha Value

A

The last value in rgba color. Decimal number between 0 (transparent) and 1 (solid color)

49
Q

Browser Prefix

A

Web browsers use browser prefixes to add CSS properties to add Css properties that aren’t part of the official W3C rules. If it is made an official CSS property, the prefix is removed.

50
Q

User-Select

A

Controls the appearance of selection.

none: makes the element appear as if it can’t be selected.
text: the text can be selected.

51
Q

Different Browser Prefixes

A
  • webkit-user-select: Chrome & Safari
  • moz-user-select: Firefox
  • ms-user-select: Internet Explorer
  • o-user-select: Opera
52
Q

Article Element

A

Article tags should be put around things like magazine or news articles and forum or blog posts.

53
Q

Column-Count

A

New property in CSS3. Puts content in 2 or more columns.

54
Q

Linear-Gradient

A

Adds a gradient background fill.

background-image: linear-gradient(top, red,blue);

55
Q

Multi-Colored Gradients

A

Gradients can have a list or 2 or more colors separated by a comma. Default direction is top to bottom.
background-image: linear-gradient (green, yellow);
Green will be on top, followed by yellow.

56
Q

Background-Attachment

A

Makes the background go from the top of the page to the bottom.
background-attachment: fixed; (stay in place)
scroll; (move with user)

57
Q

Figure Tag

A

Is put around content like images, maps, and videos that are important to the meaning of the page but can be positioned anywhere without changing the meaning.

58
Q

Figcaption

A

Optional caption for the figure inside the figure tag.

figcaption) Caption here! (/figcaption

59
Q

Figure Style

A

The default figure style has a large left and right margin.

60
Q

Meta Tags

A

Meta tags contain info about a page not visible to viewers. No end tag. Most contain name and content attributes.

61
Q

Meta Tags for search engines

A

Description : Sentence describing your page, often displayed in search results.
Keyword : List of keywords related to your site. Not used by google, but is used by Yahoo and other small search engines.

62
Q

Robot Meta Tags

A

Robots are computer programs used by google to create a list of all web pages. Robot meta tags tell robots how to search site and which pages to add.

63
Q

Meta Charset

A 
This character encoding meta tag tells the computer how to store characters. 
(meta charset="utf-8")
Added after (!doctype html)
64
Q

Table Element

A 
(table)
   (tr) Table Row (optional closing tag)
   (td) Table Data (oct)
   (th) Table Header
(/table)
65
Q

Rowspan

A

Vertically fills multiple rows.

(td rowspan=”4”) Data

66
Q

Colspan

A

Horizontally fills multiple columns.

(td colspan=”2”) Data

67
Q

Border-Collapse

A

border-collapse:collapse;

Put in “table” selector, removes space between table cells.

68
Q

Class attribute & selector

A

In css code, any selector that begins with a period is called a class selector.

69
Q

Class Names

A

Almost always use only lowercase letters, numbers, hypens, & underscores. *Cannot start with a number or double dash.
Class = “different-classes-are-separated by-a-space”

70
Q

Descendant Selectors

A

Properties with a .class selector take priority over element selectors like body or p.

71
Q

Position

A

Changes the display type.

72
Q

Static

A

Render in order as they appear in the document.

73
Q

Absolute

A

Absolute elements are positioned relative to its first non-static ancestor element.

74
Q

Fixed

A

Fixed elements are positioned relative to the browser window.

75
Q

Relative

A

Positioned relative to its normal position. They are shifted using left, right, top, & bottom properties.

76
Q

Fixed Position

A

top,right,bottom,left: sets the distance from the t.r.b.l. for absolute & fixed position elements.
—
top: 20px;

77
Q

Navigation Element

A

(nav) is put around a group of links to other pages in a web site.

78
Q

Vertical-Align

A

Controls the vertical alignment of elements. (baseline, top, bottom, middle)

79
Q

Opacity

A

Sets the transparency of an element. Decimal between 0 (transparent) and 1 (opaque). opacity: 0.5;

80
Q

@media print

A

A media query used to write rules that only apply to printing.

81
Q

@media screen

A

A media query used to write rules that only apply when the page is displayed on screen.

HTML (1 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions