Scribd
Upload
724 views

HTML&Css Quetion

The document describes how to complete the markup for various HTML elements: 1. It asks how to complete a form markup to include an email input field and submit button labeled "Email". 2. It asks how to complete a form markup to make the "Sale Ends" field read-only and include radio buttons for new/existing customer options. 3. It asks how to complete a bulleted list markup to display services provided by a company. 4. It asks how to complete a link markup to allow users to navigate between questions and answers on a webpage.

Uploaded by

manvi mahipal
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
724 views

HTML&Css Quetion

The document describes how to complete the markup for various HTML elements: 1. It asks how to complete a form markup to include an email input field and submit button labeled "Email". 2. It asks how to complete a form markup to make the "Sale Ends" field read-only and include radio buttons for new/existing customer options. 3. It asks how to complete a bulleted list markup to display services provided by a company. 4. It asks how to complete a link markup to allow users to navigate between questions and answers on a webpage.

Uploaded by

manvi mahipal
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 11

1. You are creating a form that accepts user email addresses.

You write the following HTML markup:


<form action="#">
< input type ="email" / >
< input type:" "submit" value="submit" title="Email"/>
</form>
You need to determine how the form will behave.
Answer area: -
yes NO

 The form will reload the webpage when it is submitted.


 The form will only submit if a valid email address is entered
 The form contains a single button that will attempt to submit the form
when clicked.
 The text inside the submit button be Email.

2. You are creating the following webpage:

The user must not be able to modify the value in the Sale Ends field. When the user clicks the Submit button, the form must be
processed.
Answer area: -
< form action="doCust.php" method="POST">
Sale Ends:
< input type="text” value="July 4th" _____________>
<br>
< label>New Customer</label>
< input type:" __________" name="isNew value:" True" >
< label >Existing Customer</label>
< input type=" ___________" name="isNew value:" False" >
<br><br>
input type="__________"value="Submit">
< / form >
Option: -
 Readonly
 Radio
 Submit
 Placeholder
 Checkbox
 button

4. You are designing a website for A Datum Corporation.


You need to Create a bulleted list showing tip types of services that the company provides.
How should you complete the markup? To answer. select the appropriate markup segments in the answer area.
NOTE: Each correct selection is worth one point
Answer area: -
<html>
<body>

___________________
 <dt>
 <li>
 <ol>
 <ul>
_____________________

 <dt>Storage</dt>
 <li>Storage</li>
 <ol>Storage</ol>
 <ul>Storage</ul>

_____________________________

 </dt>
 </li>
 </ol>
 </ul>

</body>

</html>

5. You are designing a webpage that presents a sample intelligence test. It displays a few questions and their answers on the
page. You want to allow the user to tap or click a link to
immediately go to the answers section. The webpage is shown in the exhibit. (Click the Exhibit tab.)
You need to complete the markup to allow the user to navigate to the answer section correctly after clicking or tapping on the
Go TO Answers link
How should you complete the markup? To answer, select the appropriate markup segment in the answer area.
Answer area: -
<a _______="____________">Go to Answer</a>
 class answers
 href #answers
 id
In 10 year, James will l be twice the age of his younger sister.
James's sister is 4. How old is James?
</p>
<p>
Second question goes here...
</p>
<p>
Third question goes here...
</p>
<br>
<br>
<h3 ___________="answers">
 Class
 id
 target
The answer to the question is 18
</p>
<p>
Second
</p>
<p>
Third answers,
</p>
6.You are creating an HTML page that displays blog entries. You want to ensure that your page can be indexed appropriately by search
engines.
You need to use the appropriate semantic tags for areas on the page.
Which semantic tags should you use? TO answer, drag the appropriate semantic tag from the column on the left to its purpose on the
right. Each semantic tag may be used once, more
than once, or not at all.
NOTE• Each correct selection is worth one point.

----------Displays a blog entry.


----------Displays comments about the blog entry.
----------Displays hyperlinks to related information on an external site.
Option:-
Semantic Tags:-
Nav
Aside
Article

7.You are creating an HTML that gives instructions for climbing Mt Everest.
You must create content that a browser renders according to its meaning. A portion Of the content is shown as follow:

<__________>

<a href=”climbing.html”>climbing</a>

<a href=”Supplies.html”> Supplies </a>

<a href=”Safety.html”>precaution</a>

<a href=”tips.html”> tips </a>

</____________>

<____________climbing mt.Everest</______________>

<_____________>

<img src=”Everest.jpg”alt=”mt.Everest”width=”400”height=”250”>

</_____________>

Option:-

Nav

Figure

Table

Header

Figcaption
8.For each of the following statements, select Yes if the statement is true. Otherwise, select No.

Answer Area
Yes
The following element uses a relative file path: yes no
<img src="https://www.adventureworks.com/dog.jpg- aIt="Beag1e puppy">

The web browser wiIl look in the same directory as the HTML document when
rendering the following element
<img src="dog.jpg" alt="Beagle puppy">

The following element uses an absolute file path to a jpg in the photos
subfolder:
<img src="photos/dog.jpg" alt="Beagle puppy">

9.You are creating an HTML page that displays a how-to guide. You want to display content in the folbwirg structure:
1. Learning HTML
a. Basic Elements
b.Semantic Elernents
2. Learning CSS
How should you complete the markup? To answer. drag the appropriate HTML tags to correct HTML tag locations. Each tag may be used
once. more than once. or not at all. You
may read to drag split bar between panes or scroll to view content

<_____>
<li>
Learning HTML
<_________type=”a”>
<li>Basic Elements </li>
</li>
<li>
Learning Css
</li>
</li>
Option:-
H1
H2
Li
Ol
Ul
10 .You ate creating a webpage that will display the following table
Food price
Cake $9.99
pie $8.99
You write the followir9 HTML Line numtH5 are for reference only
1.<table>
2.<TAG1>
3.<TAG2>FOOD</TAG2>
4.<TAG2>FOOD</TAG2>
5</TAG1>
6. <TAG1>
7 . <TAG3>CAKE</TAG3>
8. <TAG3>$9.99</TAG3>
9 </TAG1>
10 <TAG1>
11 . <TAG3>PIE</TAG3>
12 <TAG3>$8.99 </TAG3>
13 </TAG1>
14</TABLE>
You need to complete the markup. Use the drop-down menus to select the answer choice that completes each Statement based on the
information presented in the graphic.

The opentng and ctosjng tags for TAGI should be:


<tr></tr>
<th></th>
<td></td>
The open.ng and clostng tags for TAG2 should be:
<tr></tr>
<th></th>
<td></td>
The opening and ct05ino tags for TAG3 should be:
<tr></tr>
<th></th>
<td></td>

13. For each of the following staternents, select Yes if the statement is true. Otherwise. select No
NOTE:-Each correct selection is worth ore point. Yes no

A relative link requires that you use a protocol and server path-

You can link to a documents in a subdirectory Of the current webpage by


specifyinq only the subdirectory name and the filename.

You can use a relative link to reference image from a repository on a different
server.

The following is an example of how you format an absolute link:


https://www.contoso.com/products.html.

14. You are creating an HTML page for your company.


You need to include a comment that specifies revision number and date.
How should you Complete the markup? To answer, drag the appropriate HTML segment to the correct locations. Each segment may be
used once. more than once, or not at all. You
may need to drag the split bar between panes or Scroll to view content

___________Revision I on July 24,2017________


Option:-
<- -
<!- -
/*
//
--->
*/
15. You are creating a website for Wide World Importers. The website must show Wide World Importers on the browser tab display a
heading Of Inventory.
You ned to create structure Of the website
In which order should you arrange the markup segments to develop the Solution? TO answer, move all markup segments from the list Of
markup segments to the answer area and arrange them
in the correct order.
<HTML>

<HRAD>

TIETLE> WIDE WORLD IMPILE<TITLE>

<H1> INVENTRORY<H1>

</HTML>

<BODY>

</HEAD>

</BODY>

16. You are an intern at Tailspin Toys- to meta elements to a webpage to meet the following requirements
• You must identify terms that will help webpage stow up in search engines
• the string tailspin Toys online store should appear beneath the link in search engines.
• You must specify encoding and screen configuration.
How should you complete the markup? To answer. select the appropriate markup segments in the answer area.
NOTE: Each correct selection is worth point.
<head>

<title>Tailspin toys</title>

<meta _________=”utf-8”>

Option:

Name

Charset

http-equiv

<meta name=”viewport”_______________

Option:-

Contents=”width=device-width,initial-scale=1”>

Contents=”toys, game, puzzles, electronics, video games, Tailspin Toys”>

Contents=”tailspin toys online store”>

<meta name=”keywords”_________________

Option:-

Contents=”width=device-width,initial-scale=1”>

Contents=”toys, game, puzzles, electronics, video games, Tailspin Toys”>

Contents=”tailspin toys online store”>


17. You are designing a webpage for your school. You want to set the default language for the text on the page along a specific character
encoding and list of terms that will
identify the page to search engines.
How should you complete the markup? To answer, select the appropriate markup segments in the answer area .
NOTE:-Each correct selection is worth ore point
<html ___________=”em”>

Option:-

Charset

Lang

enctype

<meta______________=”UTF-8”>

Option:-

Charset

http-equiv

enctype

<meta______________________

Option:-

Name=”keyword” content=HTML,HTML help”>

Name=”description” content=HTML,HTML help”>

</html>

18. You are creating a homepage for Tailspin You need to determine which HTML elements will create a simple web page.
Which six HTML segments should you use to develop the solution? To answer. move appropriate HTML segments from the list of HTML
segments to the answer area and arrange them in correct order.
<h1>welcome to tailspin toys<h1>
<body><h1>welcome to tailspin toys </h1><p>Our new store on 1 main street is now open.</p></body>
</html>
<!DOCTYPE html>
<html>
</head>
<title> tailspin toys</title>
<head><title> tailspin toys</title>
19. You need to code a webpage that display a promotional video. The video is available in both mp4 and webm formats. The mp4 format
is given first priority. Tip media files are
stored in the video subfolder. The video should display in 320 x 240 with pause volume. and dosed captioning controls
How you complete the markup? TO answer. select the appropriate markup segments in the answer area.
NOTE Each correct selection is worth one point.
Option:-

<video width=”320” height=”240” control>

<video width=”320” height=”240”>

<video src=”AWpromo.mp4 width=”320” height=”240” control >

Option:-

<video src=”AWpromo.mp4 type=”video/webm”>

<source type=”video/mp4”>

<source type=”video/ AWpromo.mp4” type=”video/mp4” >

Option:-

<video src=”AWpromo.mp4 type=”video/webm”>

<source type=”video/mp4”>

<source type=”video/ AWpromo.mp4” type=”video/mp4” >

Your browser does not support the video tag.

</video>

20. This question require that you evaluate the underlined text to determine if it is correct.
You must display a logo on the right-side of a webpage. The logo must be compatible with screen readers. You write the following line of
markup.
<img src="Logo.png" style="width:100px; height:100; float:right">
In order the line Of markup to validate. you must add the closing img tag.
Review the underlined text If it makes statement correct. select 'No Change is needed."if statement is incorrect. select the answer choice
that makes statement

NO change is needed.

the path to the image folder.

add the alt attribute.

create a style rule for the image in external CSS file.

21. You write the following HTML markup to display an image


<img src=”flowers.png” alt=”flowers” title=”Carnations”>
use the drop-down menus to select the answer choice that answers each question based on the information presented in the markup
Each correct selection is worth one point.

What text will be display as the image loads?


Option:-
Carnations
Flowers
What text will be display as tool tip?
Option:-
Carnations
Flowers
Where must the image file be located?
Option:-
In the root folder of the webside
In the same folder as html page
22. Adventure Works wants you to add an to the company home page. The image should 100 pixels wide by 50 pixels high. The home page
should display the name if the image cannot be loaded.
You need to complete markup to add an to the existing page
How mild you Complete the markup? To answer. select the rnarkup segments in the answer area.

------------ ---------------- =”companylogo.jpg” --------------=”Adventure work”


<input alt style, span, alt
<p src
<img div

---------------- ------------------>
Height=”50” width=”50”
Height=”50em” width =”50em”
Height=”50 pixels width =”50 pixels”

23. You wort as a tutor at a community programming boot camp.


You need to explain the characteristics of the canvas element and the svg element.
For each of the statements. select Yes if statement is true. Otherwise. select Ne
Each correct selection is worth one point.
Answer Area yes no
used to secure and graphics
Enlarging an image rendered by element can decrease its quality.
SVG content can be created or with any text editor.

24. You are building website and want to have three link called Home. Product Info Contact Us. You have assigned all of these elements to
a class called main.
You need to create a selector that applies to all three links.
Which selector should you use?
A. #main
B. .main
C. a#main
D. a[name=”main”]

25. You are preparing a presentation CSS best practice


For each of the statements. select Yes if statement is true. Otherwise select
Each correct selection is worth
Answer Area yes no

You should specify a margin for each element


following a correct CSS comment:
// Stylize the #header
It is best practice to set the font-family attribute in an html or body selector
Pixels (PX) more precision and a better visual connection between the
value and actual result than em.

36.You write the following markup. Line numbers are included fot reference only.
01 <!DOCTYPE thml>
02 <html>
03 <head>
04 <title>city power & light</title>
05 </head>
06 <body>
07 <p>welcome to city power & light</p>
08 </body>
09</html>

What style will be used to render the code?


The browser default style will be used.
An external style will be used.
An inline style will be used.
An internal will be used,
27. Which CSS property is used to draw a line over text. through text. or under text?

Text-overflow
Font-style
font -family
text-decoration

28. You are creating a webpage for the School Of Fine Arts. You display key terms green. bold. underlined text.
You need to create a style named
How should you complete the code? To answer. drag the appropriate CSS attribute to the correct position Each attribute may be used
once, more than once. or not at all You may
reed to drag the split bar between panes or scroll to view content
.keyteams{

____________Green;

______________Bold;

______________Underline;

Option: -

Text-decoration

Text-style

Text-Wight

Text-transform

Color;

Text-decoration-color;

29. You are creating stylesheet that specifies that all images must appear to the left of the left of their text The images should have a left
margin of 10 pixels, a width of 200 pixels and a height of
300 pixels
How should you complete the code? TO answer, drag the appropriate CSS property to correct locations Each property may be used once.
more than or not at all. You may
need to drag the split bar between panes or scroll to content.

.img

______200px;

____300px;

_______Left;

______10px;

Option:-

Width;

Float;

Height;

Margin;

Margin-left;
Line-height;

Min-width;

You might also like