To write an html file implementing the concept inline, external & internal style sheets.
HTML Source:
<!DOCTYPE html>
<html>
<head>
<title>iView Technoreader</title>
<link rel="stylesheet" type="text/css" href="E:\documents\IM LAB\html\CSS 1\enternal.css">
<style>
#box
{
text-align:center;
font-style:italic;
font-size:40px
}
span.indent
{
padding-left: 1em
}
</style>
</head>
<body>
<center>
<h1 style="text-align:center;font-style:monospace;font-weight:bolder;font-size:70px">TechnoReader</h1>
<h5 style="font-size:25px">#iView-The way i-View!!</h5>
<hr>
<img src="C:/Users/sanjam/Documents/download.jpg">
</center>
<br>
<p>
Messaging app Telegram's new update brings new photo editor 2.0 with selfie masks, GIF creation, new stickers, photo text and drawing support.
<br>
Now Telegram app users will be able to create their own GIFs by simply recording a video in the app and can share them as a looped autoplayed GIF by tapping on to the new mute button.
<br>
The animations will be saved to GIFs section so users can quickly react to anything with a set of their own prerecorded GIF-emotions.
<br>
</p>
<blockquote id="box">
"Today we are pushing the photo editor to the next level with the fun stuff: you can now add drawings, masks, stickers and text right onto your pictures."
</blockquote>
<p>
The app is updated with the capability of identifying faces on photos and uses mask meta-data to find the perfect spot, notes blog post.
Other photo editing tools includes adding text and drawings to your photos.Lastly, there is a new trending stickers tab that keeps all the new stickers at one place.<br>
</p>
<hr><hr>
<span>
<a id="name" href="mailto:sanjam531@gmail.com" style="font-size:40px;font-weight:bold;">Sanjampreet Singh</a>
<br>
<a href="http://sanjamhelping.blogspot.in/p/it-14304-it-methodologies-lab.html">Department Of Information Technology</a>
<br>
<a href="E:\documents\IM LAB\html\HTML4.html" style="text-align:left;"><-Last Practical</a>
<span class="indent"></span>
<a href="E:\documents\IM LAB\html\CSS 2\css 2.html" style="text-align:right;">Next Practical-></a>
</span>
</body>
</html>
CSS Code:
body
{
background-color:#3A73A3;
}
p
{
font-style:serif;
font-size:40px;
text-align: justify;
}
span
{
font-style:sans-serif;
text-decoration:underline;
font-size:35px;
text-align: center;
}
Output:
Include the following source Code in Document Environment in your LaTeX File
LaTeX Source:
\documentclass[12pt]{article}
\usepackage{graphicx}
\usepackage{wrapfig}
\usepackage{multicol}
\usepackage{caption}
\usepackage{subcaption}
\usepackage{transparent}
\usepackage{multirow}
\usepackage{eso-pic}
\usepackage[utf8]{inputenc}
\usepackage{color}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\newcommand\BackgroundIm{
\put(0,0){
\parbox[b][\paperheight]{\paperwidth}{
\vfill
\centering
{\transparent{0.05} \includegraphics[height=\paperheight,width=\paperwidth,
keepaspectratio]{gne}
\vfill
}}}}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\begin{document}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\AddToShipoutPicture{\BackgroundIm}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\newpage
\pagenumbering{gobble}
\section{\emph{To write an html file implementing the concept inline, external \&\ internal style sheets.}}
\subsection{\emph{Code}}
\begin{verbatim}
<!DOCTYPE html>
<html>
<head>
<title>iView Technoreader</title>
<link rel="stylesheet" type="text/css" href="enternal.css">
<style>
#box{
text-align:center;
font-style:italic;
font-size:40px}
span.indent
{ padding-left: 1em }
</style>
</head>
<body>
<center>
<h1 style="text-align:center;
font-style:monospace;
font-weight: bolder;font-size: 70px ">TechnoReader</h1>
<h5 style="font-size:25px">#iView-The way i-View!!</h5><hr>
<img src="C:/Users/sanjam/Documents/download.jpg"></center><br>
<p>Messaging app Telegram's new update brings new photo editor
2.0 with selfie masks, GIF creation, new stickers, photo
text and drawing support.<br>
Now Telegram app users will be able to create their own
GIFs by simply recording a video in the app and can share
them as a looped autoplayed GIF by tapping on to the new mute button.<br>
The animations will be saved to GIFs section so users
can quickly react to anything with a set of their own prerecorded
GIF-emotions.<br></p><blockquote id="box">
" Today we are pushing the photo editor to the next level with
the fun stuff: you can now add drawings, masks, stickers and
text right onto your pictures."
</blockquote>
<p>The app is updated with the capability of identifying faces on
photos and uses mask meta-data to find the perfect spot, notes blog post.
Other photo editing tools includes adding text and drawings to your photos.
Lastly, there is a new trending stickers tab that
keeps all the new stickers at one place.<br></p><hr>
<span id="name">Sanjampreet Singh</span> :
<a href="mailto:sanjam531@gmail.com"
style="font-size:40px;font-weight:bold;">E-Mail</a>
<a href="E:\documents\IM LAB\html\HTML4.html" style="text-align:left;">
<-Last Practical</a>
<span class="indent"></span>
<a href="E:\documents\IM LAB\html\CSS 2\css 2.html" style="text-align:right;">
Next Practical-></a></body>
</html>
------------------------------------------------------------------------
External.css:
body
{
background-color:#37408B;
}
p
{
font-style:serif;
font-size:40px;
text-align: justify;
}
span
{
font-style:sans-serif;
text-decoration:underline;
font-size:35px;
}
\end{verbatim}
\newpage
\subsection{\emph{Output:}}
\begin{figure}[h]
\centering
\includegraphics[scale=0.3]{P4css}
\caption{Output of HTML and CSS}
\end{figure}
\end{document}
\usepackage{graphicx}
\usepackage{wrapfig}
\usepackage{multicol}
\usepackage{caption}
\usepackage{subcaption}
\usepackage{transparent}
\usepackage{multirow}
\usepackage{eso-pic}
\usepackage[utf8]{inputenc}
\usepackage{color}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\newcommand\BackgroundIm{
\put(0,0){
\parbox[b][\paperheight]{\paperwidth}{
\vfill
\centering
{\transparent{0.05} \includegraphics[height=\paperheight,width=\paperwidth,
keepaspectratio]{gne}
\vfill
}}}}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\begin{document}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\AddToShipoutPicture{\BackgroundIm}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\newpage
\pagenumbering{gobble}
\section{\emph{To write an html file implementing the concept inline, external \&\ internal style sheets.}}
\subsection{\emph{Code}}
\begin{verbatim}
<!DOCTYPE html>
<html>
<head>
<title>iView Technoreader</title>
<link rel="stylesheet" type="text/css" href="enternal.css">
<style>
#box{
text-align:center;
font-style:italic;
font-size:40px}
span.indent
{ padding-left: 1em }
</style>
</head>
<body>
<center>
<h1 style="text-align:center;
font-style:monospace;
font-weight: bolder;font-size: 70px ">TechnoReader</h1>
<h5 style="font-size:25px">#iView-The way i-View!!</h5><hr>
<img src="C:/Users/sanjam/Documents/download.jpg"></center><br>
<p>Messaging app Telegram's new update brings new photo editor
2.0 with selfie masks, GIF creation, new stickers, photo
text and drawing support.<br>
Now Telegram app users will be able to create their own
GIFs by simply recording a video in the app and can share
them as a looped autoplayed GIF by tapping on to the new mute button.<br>
The animations will be saved to GIFs section so users
can quickly react to anything with a set of their own prerecorded
GIF-emotions.<br></p><blockquote id="box">
" Today we are pushing the photo editor to the next level with
the fun stuff: you can now add drawings, masks, stickers and
text right onto your pictures."
</blockquote>
<p>The app is updated with the capability of identifying faces on
photos and uses mask meta-data to find the perfect spot, notes blog post.
Other photo editing tools includes adding text and drawings to your photos.
Lastly, there is a new trending stickers tab that
keeps all the new stickers at one place.<br></p><hr>
<span id="name">Sanjampreet Singh</span> :
<a href="mailto:sanjam531@gmail.com"
style="font-size:40px;font-weight:bold;">E-Mail</a>
<a href="E:\documents\IM LAB\html\HTML4.html" style="text-align:left;">
<-Last Practical</a>
<span class="indent"></span>
<a href="E:\documents\IM LAB\html\CSS 2\css 2.html" style="text-align:right;">
Next Practical-></a></body>
</html>
------------------------------------------------------------------------
External.css:
body
{
background-color:#37408B;
}
p
{
font-style:serif;
font-size:40px;
text-align: justify;
}
span
{
font-style:sans-serif;
text-decoration:underline;
font-size:35px;
}
\end{verbatim}
\newpage
\subsection{\emph{Output:}}
\begin{figure}[h]
\centering
\includegraphics[scale=0.3]{P4css}
\caption{Output of HTML and CSS}
\end{figure}
\end{document}
Comments
Post a Comment