HSC IT SOP Practical Programs Solution

Skill Oriented Practical Solutions Science Commerce: HSC IT SOP Chapter1

Here are the solutions for your Skill Oriented Practicals(SOP) of HSC class 12th Information Technology(IT) Subject for students of Arts, Science, and Commerce. SOP practical program solutions for chapter 1 Advanced Web Designing Hsc IT of science commerce and Arts.

HSC IT SOP Practical Program Solutions – Chapter 1 Advanced Web Designing

 

HSC IT SOP Practical Programs Solution
HSC IT SOP Practical Programs Solution

 12th HSC IT NEw paper pattern new syllabus 2021-22 Read More

it practicals for hsc commerce, practicals_it.pdf, it practical for hsc science

12th HSC IT Notes Full Chapters new syllabus with exercise solutions Read More

SOP Practical program Solutions of chapter 3 Advanced Javascript Read More

SOP 1 Question:

Create a website using HTML5 and CSS using any 4 CSS properties. Write a code for two separate pages having different file names such as first page Index.html and second page as page2.htm. Every page must contain proper Meta data information and design as follows-

The Index page must contain a heading that is highest among other text on pages and must be at the center of the page. There must be a paragraph that introduces general information about the theme and atleast 3 style tags and one image with alternate text. Page must be connected with proper navigational links.

The second page must contain a feedback or enrollment form related with theme chosen features of HTML5. The form must contain text element and and email address of the company or person. Include the Submit Button.

SOP 1 Code File (index.html)

<!DOCTYPE html>
<html>
<head>
	<style type="text/css">
		p
		{
			text-decoration : underline;
			font-style: bold;
			color:green;
			font-size: 24px;
		margin-left: 130px;	
		max-width: 1100px;

		}
		h1
		{
			
			text-align: center;
		}

	</style>
	<title>
		XYZ College of Commerce Science & Arts
	</title>
	<meta name="keywords" content="Faculty, students">
	<meta name="description" content="A college Website dealing with students and teachers/Faculty's data">
</head>
<body>
<h1>
	XYZ College of Commerce Science & Arts
</h1>
<nav style="font-size: 22px;">
	<a href="page2.html">Feedback Form</a>|
	<a href="page3.html">Contact Form</a>
	
	
</nav>
<br>
<br>
<p>
	Education is the most powerful weapon which you can use to change the world. Everyone is looking to change the world, and why not take part in these movements<sup>?</sup> People are paying a ridiculous amount of money for education, as this industry is valued around million dollars. Most of this amount is now spent on online education. Of course, our organization would like to give you an opportunity to take a fraction of this platform. The best way to gain quality education is to join with us where you can find majority of academic fields to enhance your career with.Many streams of subjects are available at our place.
</p>
<br>
<img src="sample.jpg" width="250px" height="250px"	 alt="XYZ College" align="right">
</body>
</html>

page2.html

<!DOCTYPE html>
<html>
<head>
	<style type="text/css">
		h1
		{
			text-align: center;
		}
		div
		{
			margin-left: 500px;
			margin-top: 120px; 
		}
	</style>
	<title>
		Subject Streams according to admission
	</title>
<meta charset="utf-8" >
<meta name="keywords" content="political Science,Information technology">
<meta name="description" content="Subject Streams according to admission process">
</head>

<body>
<h1 >
	Feedback Form
</h1>
<div>
<label for="name">Name:</label>
<input type="text" name="name" ><br><br>
<label for = "email">Email:</label>
<input type="email" name="email">
<br>
<br>
<input type="submit" name="submit">
</div>
</body>
</html>

 

Feedback Form





page3.html

<!DOCTYPE html>
<html>
<head>
	<title>
		
	</title>
</head>
<body>
<h1> Third Page
</h1>
</body>
</html>

Video explanation for SOP practical 1 Solutions

hsc it sop practical solutions science commerce: HSC IT SOP Practical Program Solutions

For Advanced JAvascript Exercise solution 2021 Click to Read

Related Post

Amazon Offer on Academic books Best Deals Read More

SOP 2 Question:

Create a Website Using HTML and CSS code to design a web page as layout given-

SOP 2 Code File

<!DOCTYPE html>
<html>
<head>
	<title>SOP2 Advanced Web Designing Practical</title>
<style type="text/css">
	ol
	{
		font-size: 20px;
		margin-left: 240px;
		background-color: #f7f5d2;
		width:190px;
		
	}
	ul
	{
		font-size: 20px;
		max-width: 190px;
		background-color: pink;
		margin-left: 480px;
		display: block;
		
	}
</style>
</head>
<body>
<h1 style="background-color: cyan;color:#f011b4;margin-left: 240px;width: 500px;text-align: center;height: 60px;">
	Tourist Places
</h1>
<ol>
	<b>City</b>
	<li>Pune</li>
	<li>Bangalore</li>
	<li>Hyderabad</li>
	<li>Delhi</li>
</ol>
<ul>
	Tourist Places in Pune
	
		<li> Shanivarwada</li>
		<li> Kelkar Museum</li>
		<li>Sinhgad Fort</li>
</ul>
</body>
</html>

Video Solution explanation for SOP2 HSC IT Practicals for Science Commerce & Arts

 

hsc it practical solutions, hsc it practical solutions for science

SOP 3 Questions:-

Create a website using HTML and CSS code to design web pages as-

The first page will accept the name of the traveller date of travel, telephone number, also a submit button

The second web page has information about the transporter , time seat no destination displayed as unordered list

  • Name of Transporter – Air Asia
  • Time – 09:30 AM
  • Seat No – B39
  • Destination – Delhi

Both Pages should be interlinked. Create External Stylesheet with relevant tgs.

SOP 3 Code File(First.html)

<!DOCTYPE html>
<html>
<head>
	<title>SOP3 Demostration</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body bgcolor="lightyellow">
<table>
	<tr>
		<td>
			<label for="name">
				Traveller Name:
			</label>
			<input type="text" name="Traveller_name" id="name">
		</td>
	</tr>
	<tr>
		<td>
			<label for="date">Travelling Date:</label>
			<input type="date" name="Travelling_date" id="date">
		</td>
	</tr>
	<tr>
		<td>
			<label for="phone_no">
				Telephone No:
			</label>
			<input type="tel" id="phone" name="phone" pattern="[0-9]{2}-[0-9]{10}">

		</td>
	</tr>
	<tr>
		<td>
			<input type="image" name="Submit" id="Submit" src="Submit.png" onclick="window.location.href='second_page.html';">
		</td>
	</tr>
	
</table>
</body>
</html>


SOP3 Demostration Output



Second Page.Html

<!DOCTYPE html>
<html>
<head>
	<title>Second Page Html</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div>
<ul>
	<li>
	Name of Transporter - Air Asia
</li>
<li>
	Time - 09:30 AM
	</li>
	<li>
		Seat No - B39
	</li>
	<li>
		Destination - Delhi
	</li>
</ul>
<input type="submit" name="submit" value="Back" onclick="history.back();">
</div>
</body>
</html>

Output of Second.html

  • Name of Transporter – Air Asia
  • Time – 09:30 AM
  • Seat No – B39
  • Destination – Delhi

Note: Student if you find it difficult with then watch the video for complete demonstration of these practicals as i explained these with some editing of tags also so for video below link and if you have any doubts you can comment below in comment box.

link click link and subscribe for more

StyleSheet File (style.css) for above SOP 3 practical)

ul
{
	list-style-type: none;
}
div
{
	margin-left: 230px;
	margin-top: 130px;
	font-size: 25px;
}
table
{
	margin-left: auto;
	margin-right: auto;
	margin-top: 230px;
	font-size: 25px;
}

Sop4 Textbook Exercise Solution Chapter 1 Advanced Web design

Write code using CSS & HTML the following web page giving desired output.

<!DOCTYPE html>
<html>
<head>
	<title>Sop4 Demo practical</title>
	<style type="text/css">
		body
		{
			background-color: lightgrey;
		}
		nav
		{
			background-color: blue;
			height:30px;
			line-height: 30px;
			font-size: 18px;
			font-family: sans-serif;
		}
		span
		{
			font-size: 20px;
		}
		a
		{
			color:#FFFFFF;
			padding: 15px;
		}
		section
		{
			float: left;
			width: 70%;
			background-color: grey;
			margin: 5px 0;
		}
		article
		{
			background-color: white;
			margin: 0 5px;
		}
		footer
		{
			background-color: blue;
			line-height: 20px;
			height:20px;
			margin: 5px 0;
			color: white;
			padding:12px;
			font-size: 20px;
			font-family: sans-serif;
			clear:both;
		}
		aside
		{
			float: right;
			width: 29%;
			margin: 5px 0;
			background-color: grey;
		}
		h2,h3,h1,p
		{
			margin : 5px  0;
			padding :0  10px;

		}
	</style>
</head>
<body>
	<header>
		<h1>News</h1>
		<h3> Local and National News</h3>
		<nav>
			<a href="#"><span>H</span>OME</a>
			<a href="#"><span>A</span>rchives</a>
			<a href="#"><span>A</span>bout</a>
		</nav>
	</header>
<aside>
	<h2>BE A NEWS REPORTER</h2>
	<p>If you see news happening. Send us a Text.</p>
</aside>
<section>
	<h2>Local News</h2>
<article>
	<h3>Fire Fighters rescue man from building this is local news 1</h3>
<p>(reporter name, date)</p>
<p>  This is the fighter details. This is the story of fighter.
<br>
This is the detail of rescue man. This is the story of how is rescued.
</p>
</article>
	<article>
	<h3>
		New Library to be built this is local news 2
	</h3>
	<p>(reporter name,date)</p>
	<p> This is the story text. This is the story text.
		<br>
	This is the story text. This  is the story text.</p>
</article>
</section>
<section>
	<h2>
		National News
	</h2>
	<article>
		<h3>
		Snow storm is making travel difficult </h3>
<p>(reporter name, date)</p>

<p>This is the story snow storm. This is the story distoiral of storm.
	<br>
This is the story part continued . This is the story text continued.</p>
</article>
<article>
<h3>Thousands are without power</h3>
<p>(reporter name, date)</p>
<br>
<p>This is the story of not having power. This is the story text continued.
<br> This is the story bad effect. This is the story about destroyal of economy.
</p>
</article>
</section>
<footer>
footer information
</footer>
</body>
</html>











SOP5.

skill oriented practicals class12

Solution code:-

sop solution chapter1 new syllabus class 12

SOP6.

sop 6 chapter 1 class 12

Solution Code:-

hsc it skill oriented practical solutions chapter1

sop 7 adv web designing class 12

Solution code:-

sop 7 adv web designing class 12 solution code skill oriented practicals

SOP8

Solution:-

For all the above skill-oriented practicals step-by-step practical performing solutions you can watch this playlist below for the full 8 practicals of chapter 1 advanced web designing for both science and commerce stream.

More videos on IT subject practicals and chapter explanation exercise solutions you can subscribe to this youtube channel

HSC IT New Syllabus Notes for Science Commerce and Arts CLik to read

Advanced Javascript Notes Exercise Solutions click to refer

 IT NEw paper pattern new syllabus HSC 2021-22 Read More

Ecommerce and Egovernance textbook exercise solutions Read more

Related Post

Amazon Offer on Academic books Best Deals Read More

24 thoughts on “Skill Oriented Practical Solutions Science Commerce: HSC IT SOP Chapter1”

  1. Pingback: Class 12th HSC IT Notes all chapters textbook Exercise solutions MH Board

  2. Pingback: 12th IT ServerSide Scripting PHP Practical Solutions Hsc Maharashtra board new syllabus 2021 | Techniyojan

  3. Pingback: 12th Sci IT SOP Solutions All Chapters HSC Mah Board | Techniyojan

  4. Pingback: Subject Codes HSC Maharashtra Board | Techniyojan

Leave a Comment

Your email address will not be published. Required fields are marked *

error: