CT 244 HTML/CSS
External CSS
._____.CSS; Can be linked to other files, site wide design
Domain extensions
.com, .edu, .info, .net, .org, .gov
Desktop view size
1440 px
Index.HTML
1st file browser will grab, mostly home page
Mobile view size
375 px
Ipad/midpoint view size
768 px
In-line CSS
<a style =" ">; goes into a tag, hard to override and controls one tag
Code for.......
<element name attribute = "value">
Linking to CSS file
<link rel = "stylesheet" type = "text/css" href = "rest.css"
Most important element in SEO
<title>; title of document seen in browser tab
Absolute URL
A URL that gives the full path to a resource. EX: http://google.com
Where is reset CSS in code
Always on top
<a>
Anchor Tag - used to create a link to another document.
=
Assign value
CSS
Cascading style sheet
CMS
Content Management System; don't code every page, content is added and generated EX: Amazon and blogs
HTML entities
Each symbol has a specific code EX: @, <, >, =, copyright symbol
</>
End
Semantic layout
Every tag has meaning to it
Positioned object
Fixed, absolute and realitive
Relative position
Freely moving , moves from original spot
Block level element
Header- creates a line break; comes up in search engine based on importance EX: h1, h2, h3
HTML
Hyper Text Markup Language
Block level element definition
Line break in front and after
Progressive enhancement concept
Mobile size is created first.. then desktop then ipad
Why test pages with Chrome?
Most commonly used browser
Does HTML embed any external assets such as fonts and images:
NO
File naming rules
No spaces, no special characters (except _ and -), recommended no capitalizations
Fixed position
Position to browser window
Absolute position
Positioned realities to nearest ancestor; if none it uses document body
Screen based design units
RGB and pixels
SEO
Search Engine Optimization
Padding definition
Space in between border box and content box
<>
Start
Embedded CSS
Style sheet in head content; only the 1st page is embedded in page different than reset
Padding order
Top, right, bottom, left
4. Which of the followings selects a tag with an ID named container: a) #container b) $container c) @container d) *container
a) #container
Which of the followings statement is false: a) <img> tag has two required attributes: href and alt b) <img> tag defines an image in an HTML page c) <img> tag has no end tag
a) <img> tag has two required attributes: href and alt
How can you make a numbered list? a) <ol> b) <dl> c) <list> d) <ul>
a) <ol>
Which of the following statements is true: a) JPG is designed for photographic images b) JPG compression is lossless c) JPG's alpha channel is 8-bit d) JPG can contain animation
a) JPG is designed for photographic images
While saving PNG with transparency, you should use: a) PNG 24 b) PNG 16 c) PNG 8
a) PNG 24
Which is the correct CSS syntax? a) body {color: black;} b) body:color=black; c) {body:color=black;} d) {body;color:black;}
a) body {color: black;}
5. How do you add a background color for all <h1> elements? a) h1 {background-color:#FFFFFF;} b) all.h1 {background-color:#FFFFFF;} c) h1.all {background-color:#FFFFFF;}
a) h1 {background-color:#FFFFFF;}
By default, background image repeats both horizontally and vertically: a) true b) false
a) true
Which one of the followings is not a common breakpoint: a) 1440px b) 866px c) 375px d) 320px
b) 866px
Which of the following statement is untrue: a) Reserved characters in HTML must be replaced with character entities. b) Entities is part of the CSS document. c) Characters that are not present on your keyboard like © can also be replaced by entities. d) All of the above.
b) Entities is part of the CSS document.
Which of the following statement is untrue: a) No space is allowed in the file name for web. b) Web file name has to be all lowercase. c) Special characters that are not in the file name for web. d) All of the above.
b) Web file name has to be all lowercase.
In which of the following situation you will save file using PNG format: a) photographic images b) image with transparency c) image with animation d) graphic file such as logo
b) image with transparency
Which of the followings CSS will not result in a "positioned element": a) position: absolute b) position: static c) position: relative d) position: fixed
b) position: static
What is the correct HTML for referring to an external style sheet? a) <style src="mystyle.css"> b) <stylesheet>mystyle.css</stylesheet> c) <link rel="stylesheet" type="text/css" href="mystyle.css">
c) <link rel="stylesheet" type="text/css" href="mystyle.css">
Which of the following statements is false: a) GIF can contain animation b) GIF compression is lossless c) GIF's alpha channel is 8-bit d) GIF has only 256 colors
c) GIF's alpha channel is 8-bit
Which of the followings statement is false: a) a block-level element's width is 100% of its parent element by default b) if you position a block-level element using fixed, absolute, or relative, the width of the element will be defined by its content c) a block-level element can not be nested inside of another block-level element d) by default, browser display the block-level element with a line break both before and after the element
c) a block-level element can not be nested inside of another block-level element
Which is the correct CSS property for changing the color of texts: a) text-color b) font-color c) color d) type-color
c) color
Which of the followings is the correct CSS property for adjusting type size: a) font size: b) type-size: c) font-size: d) text size:
c) font-size:
Which part(s) of the following code is called "value": <link rel="Stylesheet" type="text/css" href="main.css"> a) link b) Stylesheet c) main.css d) type
c) main.css
How do you insert margin so that it is: 10 pixels at the top 15 pixels at the right 10 pixels at the bottom 15 pixels to the left? a) margin: 15px 15px 10px 10px; b) margin: 10px 10px 15px 15px; c) margin: 10px 15px; d) margin: 15px 10px;
c) margin: 10px 15px;
Which of the following is the correct "descendant selector" which select all li inside of nav: a) nav+li b) nav~li c) nav li d) nav, li
c) nav li
How do you display a padding like this: The top padding = 10 pixels The bottom padding = 5 pixels The left padding = 20 pixels The right padding = 1 pixel? a) padding:10px 20px 5px 1px; b) padding:10px 5px 20px 1px; c) padding:10px 1px 5px 20px; d) padding:5px 20px 10px 1px;
c) padding:10px 1px 5px 20px;
"position: static" means the HTML element is: a) not moving b) positioned relative to its normal position c) positioned according to the normal flow of the page d) positioned relative to the viewport
c) positioned according to the normal flow of the page
Which of the followings is not a image file format for web: a) jpg b) png c) tif d) gif
c) tif
Choose the correct HTML tag for the most important heading: a) <heading> b) <head> c) <h6> d) <h1>
d) <h1>
Which of the followings set up CSS rule blocks that only apply to screen larger than 769 px: a) #media screen and (min-width: 769px) { } b) #screen media and (min-width: 769px) { } c) @media screen and (max-width: 769px) { } d) @media screen and (min-width: 769px) { }
d) @media screen and (min-width: 769px) { }
Which of the following statement is true: a) URL stands for Uniform Resource Locator b) URL is a reference to a web resource that specifies its location and a mechanism to retrieving it. c) Most of browsers display the URL of a web page above the page in the address bar. d) All of the above
d) All of the above
Which of the following statement is true? a) browser will display block-level element with line break before and after it. b) width and height properties do not apply to inline-level elements. c) inline-level elements' top and bottom margins can't be changed. d) all of the above
d) all of the above.
Which of the following is the correct "group selector" which selects both h1 and h2: a) h1+h2 b) h1 h2 c) h1 & h2 d) h1, h2
d) h1, h2
"position: absolute" means the HTML element is: a) positioned relative to the viewport b) positioned relative to its normal position c) not positioned in any special way d) positioned relative to the nearest positioned ancestor
d) positioned relative to the nearest positioned ancestor
Which part(s) of the following code is called "attribute": <link rel="Stylesheet" type="text/css" href="main.css"> a) link b) Stylesheet c) main.css d) type
d) type
Which of the following statement is true: a) Traditional CSS box model defines width using content box b) Margin is the space outside of the border c) Padding is the space between border box and content box e) All of the above
e) All of the above