DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING, CANARA ENGINEERING COLLEGE
Programme: B.E. CIE: ASSIGNMENT – 1 Semester: I
Course Title: INTRODUCTION TO WEB PROGRAMMING Course Code: BPLCK205A
Date: 21/10/2024 Submission: 28/10/2024 Section: A,B,C,D & E
G1 1 Create a web page for newspaper article using following semantic elements. <article>
<aside> <details> <figcaption> <figure> <footer> <header> (M2)
2 What is the difference between HTML and XHTML? Explain ordered and unordered list with
example with changing list style. (M1)
G2 1 Create an html page with red background with a message “warning” in large size blinking.
Add scrolling text “read the message” below it. (M3)
2 Write a HTML code to generate following output.
(M2)
G3 1 Create An ellipse with a horizontal linear gradient from yellow to red (M2)
2 What is the role of the HTML forms, briefly explain with an example? (M3)
G4 1 Create polygon using SVG (M3)
2 HTML has two commands which are used to apply formatting to element within the page.
Compare and contrast the use of <div> and <span>(M3)
G5 1 Create the equation using MathML (M2)
2 What is HTML table? Explain table element rowspan and colspan with necessary attributes.
Write HTML code for following table.
(M3)
G6 1 Create following web page using HTML with tabular layout (M3)
2 Create following webpage
(M2)
G7 1 Explain the difference between HTML and XHTML. (M1)
2 Briefly explain details tag with example. (M2)
G8 1 Explain the Major Themes of (X)HTML. Explain with example(M1)
2 What happens if you specify a font that is unavailable, illustrate with an example (M2)
G9 1 XHTML is stricter language than HTML. Justify with example(M1)
2 Create an HTML page using CSS
(M3)
G10 1 Write HTML and CSS code for the following:
(i) set the background color for the active link states to "yellow".
(ii) Set the list style for unordered lists to "square".
(ii) Set "paper.gif" as the background image of the page. (M3)
2 What is the difference between HTML and XHTML? Explain ordered and unordered list with
example. (M1)
G11 1 Write HTML code for following table. (M3)
2 Create following Text Support for canvas
(M2)
G12 1 Create simple table (M2)
2 Create following equation using mathML (M2)
G13 1 What is the difference between HTML and HTML5? Explain ordered and unordered list with
example. (M1)
2 Create below HTML page with sniipet code.
(M1)
G14 1 Write the following mathematical expression by using HTML5 MathML. (M1)
2 1. Create an XHTML page using tags to accomplish the following:
(i) Put a background image to a page and demonstrate all attributes of background image
(ii) Create unordered list of 5 fruits and ordered list of 3 flowers with changing list style type.
(M3)
G15 1 Describe the different ways that styles can be added to a page(M2)
2 Explain the concept of The Future of Markup—Two Paths? (M1)
G16 1 List and explain various list tags in HTML with example. (M1)
2 Create an html page with following specifications: Title should be about my City Place your
City name at the top of the page in large text and in blue color Add names of landmarks in
your city each in a different color, style and typeface One of the landmark, your college name
should be blinking. Add scrolling text with a message of your choice. (M3)
G17 1 Why has W3C developed the XHTML specifications? (M1)
2 Create a web page for trending article using following semantic elements. <article> <aside>
<details> <figcaption> <main> <section> (M2)
G18 1 Write HTML code to display following irregular table. (M3)
2 Demonstrate the following HTML5 Semantic tags- <article>, <aside>, <details>,
<figcaption>, <figure>, <footer>, <header>, <main>, <mark>, <section> for a webpage that
gives information about college website. (M3)
G19 1 Draw a square using HTML5 SVG, fill the square with blue color and make 3px green
stroke width. (M2)
2 What advantages do tables have over other methods of presentating data? Are there likely to
be any difficulties if you use large tables and embed tables inside tables?(M3)
G20 1 Write a HTML program to design a form which should allow to enter your personal data
(Hint: make use of text field, password field, e-mail, lists, radio buttons, checkboxes, submit
button). (M2)
2 Create a class called profit and apply the back ground by various technique (color, rgb, rgba
and hexadecimal value). Explain with snippet code. (M3)
G21 1 Create an html page with all the different text styles (bold, italic and underlined) and its
combinations on separate lines. State style of each line in its text. (M1)
2 Create a .html file that contains a heading and a couple of paragraphs. You could name this
new file another_page.html, and you should place it into the same folder where your
first .html is. After you have created the new .html page, add a link to the first page so that the
browser will load another_page.html when you click the text Go to the other page. in the first
page. You need to use the and tags in this exercise. Inside the tag you need to use a href
attribute that specifies which page will be loaded when the link is clicked. (M3)
G22 1 Write HTML and CSS code for the following:
(i) set the background color for the active link states to "green".
(ii) Set the list style for unordered lists to user defined logo.
(ii) Set "a.gif" as the background image of the page. (M3)
2 Write the code necessary to create a 500 pixel by 500 pixel <canvas>. Within it, paint a green
for circle with brown color stroke. (M3)
G23 1 Create an HTML file (e.g., first_page.html) that specifies a page that contains a heading and
two paragraphs of text. Use the HTML tags and
in this exercise. As the texts in the heading and paragraphs you can use any texts you like.
Add an unordered list to this web page. An unordered list should look like the
following when it is shown by a browser:
An unordered list can be specified with the tags and An unordered list typically
contains a number of list items that can be specified with tags
After you have created your unordered list, check out what happens when you convert it to an
ordered list by replacing the tags and with and respectively. (M2)
2 What is style sheet class? Briefly explain, with an example (M3)
G24 1 Can a web page contain multiple <header> elements? What about <footer> elements? Explain
briefly with snippet code. (M2)
2 Mention the rules to be followed XHTML. Explain with example (M1)
G25 1 write HTML code for registration form. (M3)
2 Create the animation will last for 10 seconds, and it will gradually change the background-
color of the element from "green" to "blue". (M3)
G26 1 What is CSS? Explain the different types of CSS. Explain with example for External CSS.
(M3)
2 Write the code necessary to create a 300 pixel by 300 pixel <canvas>. Within it, paint a green
100 pixel by 100-pixel square with the top-left corner of the square located 60 pixels from
both the top and left edges of the canvas. (M2)
G27 1 Create the following object using SVG (M3)
2 Mention the rules to be followed XHTML with snippet code(M1)
G28 1 Explain types of selectors create a webpage using class, universal and element type of
selectors. Also demonstrate the same. (M3)
2 1. Create an XHTML page using tags to accomplish the following:
(i) Put a background image to a page and demonstrate all attributes of background image
(ii) Create unordered list of 7 fruits and ordered list of 3 flowers with changing list style type,
with user defined logo. (M3)
G29 1 What is style sheet class? Briefly explain (M3)
2 Write a HTML code to generate following output.
Create an html page with following specifications
a. Title should be about my college
b. Put the image in the background
c. Place your college name at the top of the page in large text followed by address in smaller
size
d. Add names of courses offered each in a different color, style and typeface
e. Add scrolling text with a message of your choice (M2)
G30 1
Create the equation using MathML (M1)
2 Write a HTML code to generate following output
(M2)
G31 1 Create an html page with 5 separate paragraphs in different colors. State color of each line in
its text using both class and id selectors. (M2)
2 Write and explain rules for well-formed XML document. (M1)
1 Briefly explain the following Tags. <nav>, <aside>, <article>, <menu> with snippet code.
(M2)
G32
2 Explain formatting elements with snippet code <b>, <strong>, <i>, <em>, <mark>, <small>,
<del>, <ins>, <sub>, <sup>. (M1)
1 Create following web page using HTML and CSS with tabular layout (M3)
G33
2 Briefly outline the early history of world wide web. (M1)
*M1-Module 1, M2-Module 2, M3-Module3, M4-Module 4 and M5-Module5
Roll No Group No Roll No Group No Roll No Group No Roll No Group No
01 TO 02 G1 21 TO 22 G11 41 TO 42 G21 61 To 62 G31
03 TO 04 G2 23 TO 24 G12 43 TO 44 G22 63 To 64 G32
05 TO 06 G3 25 TO 26 G13 45 TO 46 G23 65 To 66 G33
07 TO 08 G4 27 TO 28 G14 47 TO 48 G24
09 TO 10 G5 29 TO 30 G15 49 TO 50 G25
11 TO 12 G6 31 TO 32 G16 51 TO 52 G26
13 TO 14 G7 33 TO 34 G17 53 TO 54 G27
15 TO 16 G8 35 TO 36 G18 55 TO 56 G28
17 TO 18 G9 37 TO 38 G19 57 TO 58 G29
19 TO 20 G10 39 TO 40 G20 59 TO 60 G30
Rubrics for Assessment: (Recommended)
SI. No. Criteria for Evaluation Marks
1 Punctuality in submission 2
2 Structure and format 2
3 orderliness/clarity, readability 2
4 Relevance, correctness of answers 2
5 Academic Honesty 2
Instructions to Students:
1. submit the assignment within the mentioned date.
2. Answers should be written in the assignment book only with proper question number
3. Write the assignment submission date and Assignment number on the assignment book’s front page.
Signature of Course Instructor with Date Signature of Course Coordinator with Date
Coverage of modules is adequate.
APPROVED
Signature of Senior Faculty/Expert with Date Signature of Senior Faculty/Expert with Date
Signature of Senior Faculty/Expert with Date Signature of Senior Faculty/Expert with Date
HEAD OF THE DEPARTMENT/CHAIRMAN – MODERATION COMMITTEE
