Sie sind auf Seite 1von 43

AN INTERNSHIP REPORT

TRAINING ON NETWORKING AND INFOCOM


&
PROJECT ON WEB DEVELOPMENT
AT

OIL AND NATURAL GAS CORPORATION


RAJAHMUNDRY, ANDHRA PRADESH

SUBMITTED TO

SHRI ATLURI SATYANARAYANA


DEPUTY GENERAL MANAGER(E&T)
INFOCOM SERVICES
ONGC, RAJAHMUNDRY ASSET.
SUBMITTED BY
N L V VENKATA SAI

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

INDIAN INSTITUTE OF INFORMATION TECHNOLOGY, KOTTAYAM

1
ACKNOWLEDGMENT

The smooth functioning of a task depends to its large extent on


cooperation among others. So, we would like to thank
Shri A. Satyanarayana for guiding us in this internship.

We are grateful to ONGC and its employees for letting us do this


internship and guiding us through the period of our visit.

Our sincere thanks to Shri A. Satyanarayana for providing us internship on


communications, networking and infocom n ONGC, Rajahmundry Asset.

We also convey our special thanks to the following officers:

• Shri A. SATYANARAYANA DGM(INFOCOM)


• Shri SRINIVAS RAO MS CMS
• Shri MOHAMMED KAMIL E.E(ELEX)
• Smt. B V L SUHASINI CHIEF MANAGER (PROGRAMMING)

2
TOPICS

I. INTERNSHIP TRAINING TOPICS

1. ABOUT ONGC.
2. COMPUTER HARDWARE
3. BASICS OF NETWORKING.
4. EPABX.
5. COMMUNICATION TO SITES
6. SCADA.
7. WELL LOGGING.

II. PROJECT ON WEB DEVELOPMENT

3
I. INTERNSHIP TRAINING TOPICS
1. ABOUT ONGC

Oil and Natural Gas Corporation (ONGC) is an


Indian multinational oil and gas company earlier
headquartered in Dehradun, Uttarakhand, India. As a
Corporation, its registered office is now at DeendayalUrja
Bhavan, Vasant Kunj, New Delhi 110070 India. It is a Public
Sector Undertaking (PSU) of the Government of India, under
the administrative control of the Ministry of Petroleum and
natural gas. It is India's largest oil and gas exploration and
production company. It produces around 70% of India's crude
oil (equivalent to around 30% of the country's total demand)
and around 62% of its natural gas.
In a government survey for fiscal year 2016-17, it was
ranked as the largest profit-making PSU in India. It is ranked
11th among the Top 250 Global Energy Companies by Platts.
ONGC was founded on 14 August 1956 by Government
of India, which currently holds a 68.94% equity stake. It is
involved in exploring for and exploiting hydrocarbons in
26 sedimentary basins of India and owns and operates over
11,000 kilometres of pipelines in the country.
Its international subsidiary ONGC Videsh currently has
projects in 17 countries. ONGC has discovered 6 of the 7
commercially producing Indian Basins, in the last 50 years,
adding over 7.1 billion tonnes of In-place Oil & Gas volume
of hydrocarbons in Indian basins.

4
Against a global decline of production from matured fields,
ONGC has maintained production from its brownfields like
Mumbai High, with the help of aggressive investments in
various IOR (Improved Oil Recovery) and EOR schemes.
ONGC has many matured fields with a current recovery factor
of 25–33%.
Its Reserve Replacement Ratio for between 2005 and 2013,
has been more than one. During FY 2012–13, ONGC had to
share the highest ever under-recovery of INR 8993.78 billion
(an increase of INR 567.89 million over the previous financial
year) towards the under-recoveries of Oil Marketing
Companies (IOC, BPCL and HPCL). On 1 November 2017,
the Union Cabinet approved ONGC for acquiring majority
51.11% stake in HPCL (Hindustan Petroleum Corporation
Limited).
On Jan 30th 2018, Oil & Natural Gas Corporation acquired
the entire 51.11% stake of Hindustan Petroleum Corporation.

History
Foundation to 1956
Before the independence of India in 1947, the Assam
Oil Company in the north-eastern and Attack Oil company in
north-western part of the undivided India were the only oil
producing companies, with minimal exploration input. The
major part of Indian sedimentary basins was deemed to be
unfit for development of oil and gas resources.
After independence, the Central Government of India realized
the importance of oil and gas for rapid industrial development
5
and its strategic role in defence. Consequently, while framing
the Industrial Policy Statement of 1948, the development of
petroleum industry in the country was considered of utmost
necessity.
Until 1955, private oil companies mainly carried out
exploration of hydrocarbon resources of India. In Assam, the
Assam Oil Company was producing oil at Digboi (discovered
in 1889) and Oil India Ltd. (a 50% joint venture between
Government of India and Burma Oil Company) was engaged
in developing two newly discovered large
fields Naharkatiya and Moraan in Assam. In West Bengal, the
Indo-Stanvac Petroleum project (a joint venture
between Government of India and Standard Vacuum Oil
Company of USA) was engaged in exploration work.
In 1955, Government of India decided to develop the oil and
natural gas resources in the various regions of the country as
part of the Public Sector development. With this objective, an
Oil and Natural Gas Directorate was set up towards the end of
1955, as a subordinate office under the then Ministry of
Natural Resources and Scientific Research. The department
was constituted with a nucleus of geoscientists from
the Geological Survey of India.
A delegation under the leadership of the Minister of Natural
Resources visited several European countries to study the
status of oil industry in those countries and to facilitate the
training of Indian professionals for exploring potential oil and
gas reserves. Experts from Romania, the Soviet Union,
the United States and Germany subsequently visited India and
helped the government with their expertise. Soviet experts
later drew up a detailed plan
for geological and geophysical surveys and drilling operations
to be carried out in the 2nd Five Year Plan (1956–61).

6
In April 1956, the Government of India adopted the Industrial
Policy Resolution, which placed Mineral Oil Industry among
the schedule 'A' industries, the future development of which
was to be the sole and exclusive responsibility of the state.
Soon, after the formation of the Oil and Natural Gas
Directorate, it became apparent that it would not be possible
for the Directorate with its limited financial and
administrative powers as subordinate office of the
Government, to function efficiently. So, in August 1956, the
Directorate was raised to the status of a commission with
enhanced powers, although it continued to be under the
government. In October 1959, the Commission was converted
into a statutory body by an act of the Indian Parliament, which
enhanced powers of the commission further. The main
functions of the Oil and Natural Gas Commission subject to
the provisions of the Act, were "to plan, promote, organize
and implement programs for development of Petroleum
Resources and the production and sale of petroleum and
petroleum products produced by it, and to perform such other
functions as the Central Government may, from time to time,
assign to it ". The act further outlined the activities and steps
to be taken by ONGC in fulfilling its mandate.

Operations
ONGC's operations include conventional exploration and
production, refining and progressive development of alternate
energy sources like coal-bed methane and shale gas. The
company's domestic operations are structured around 11
assets (predominantly oil and gas producing properties), 7
basins (exploratory properties), 2 plants (at Hazira and Uran)
and services (for necessary inputs and support such as drilling,
geo-physical, logging and well services).
7
2. COMPUTER HARDWARE

PC (Personal Computer)
A PC can be defined as a small, relatively inexpensive
computer designed for an individual user. PCs are based on
the microprocessor technology that enables manufacturers to
put an entire CPU on one chip. At home, the most popular use
for personal computers is playing games and surfing the
Internet.

Workstation
Workstation is a computer used for engineering
applications (CAD/CAM), desktop publishing, software
development, and other such types of applications which
require a moderate amount of computing power and
relatively high quality graphics capabilities.
Minicomputer
It is a midsize multi-processing system capable of
supporting up to 250 users simultaneously.
Mainframe
Mainframe is very large in size and is an expensive computer
capable of supporting hundreds or even thousands of users
simultaneously.

8
Supercomputer
Supercomputers are one of the fastest computers
currently available. Supercomputers are very expensive and
are employed for specialized applications that require
immense amount of mathematical calculations (number
crunching).
Computer Components:
a. Input Unit
• Keyboard
• Mouse

• Joy Stick

• Light pen

• Track Ball

• Scanner

• Graphic Tablet

b. CPU (Central Processing Unit)


c. Output Unit
• Monitors
• Graphic Plotter
• Printer

9
RAM:
RAM (Random Access Memory) is the internal memory of
the CPU for storing data, program, and program result. RAM
is volatile, i.e. data stored in it is lost when we switch off the
computer or if there is a power failure. Hence, a backup
Uninterruptible Power System (UPS) is often used with
computers. RAM is of two types −
• Static RAM (SRAM)
• Dynamic RAM (DRAM)

ROM:
ROM stands for Read Only Memory. The memory from
which we can only read but cannot write on it. This type of
memory is non-volatile.
• MROM (Masked ROM)
• PROM (Programmable Read Only Memory)
• EPROM (Erasable and Programmable Read Only Memory)
• EEPROM (Electrically Erasable and Programmable Read
Only Memory)

10
A port has the following characteristics −
• External devices are connected to a computer using
cables and ports.
• Ports are slots on the motherboard into which a cable of
external device is plugged in.
• Examples of external devices attached via ports are the
mouse, keyboard, monitor, microphone, speakers, etc.

DIFFERENT PORTS:
Let us now discuss a few important types of ports −
• Serial Port
• Parallel Port
• PS/2 Port
• Universal Serial Bus (or USB) Port
11
• VGA Port
• Power Connector
• Firewire Port
• Modem Port
• Ethernet Port
• Digital Video Interface, DVI port
• Sockets

HARDWARE COMPONENTS:

• Input devices − keyboard, mouse, etc.


• Output devices − printer, monitor, etc.
• Secondary storage devices − Hard disk, CD, DVD, etc.
• Internal components − CPU, motherboard, RAM, etc.

12
SOFTWARE COMPONENTS:
Examples of system software are Operating System,
Compilers, Interpreter, Assemblers, etc.

Features of a system software −


• Close to the system
• Fast in speed
• Difficult to design
• Difficult to understand
• Less interactive
• Smaller in size
• Difficult to manipulate
• Generally written in low-level language
Internet:
It is a worldwide/global system of interconnected
computer networks. It uses the standard Internet Protocol
(TCP/IP). Every computer in Internet is identified by a
unique IP address. IP Address is a unique set of numbers
(such as 110.22.33.114) which identifies a computer’s
location.
A special computer DNS (Domain Name Server) is used to
provide a name to the IP Address so that the user can locate a
computer by a name.

13
Intranet:
Intranet is the system in which multiple PCs are
connected to each other. PCs in intranet are not available to
the world outside the intranet. Usually each organization has
its own Intranet network and members/employees of that
organization can access the computers in their intranet.

14
3. BASICS OF NETWORKING

OVERVIEW
i) Servers.
ii) IP Addresses.
iii) Hubs, Switches, Routers.
iv) Topologies.
v) ISO-OSI network architecture.

Servers:
A server is a computer program or a device that provides
functionality for other programs or devices, called "clients".
This architecture is called the client–server model, and a
single overall computation is distributed across multiple
processes or devices. Servers can provide various
functionalities, often called "services", such as sharing data
or resources among multiple clients, or performing
computation for a client.
Typical servers:
1) Database servers
2) File servers
3) Mail servers

15
4) Print servers
5) Web servers
6) Game servers
7) Application servers

IP Address:
An Internet Protocol address (IP address) is a numerical
label assigned to each device connected to a computer
network that uses the Internet Protocol for communication.
An IP address serves two principal functions.
It identifies the host, or more specifically its network
interface, and it provides the location of the host in the
network, and thus the capability of establishing a path to that
host.
Hub:
A hub, in the context of networking, is a hardware device
that relays communication data. A hub sends data packets
(frames) to all devices on a network, regardless of any MAC
addresses contained in the data packet.
Switches:
A switch, in the context of networking is a high-speed
device that receives incoming data packets and redirects them
to their destination on a local area network (LAN). A LAN
switch operates at the data link layer (Layer 2) or the network

16
layer of the OSI Model and, as such it can support all types of
packet protocols.
Routers:
A router is a device that analyses the contents of data
packets transmitted within a network or to another network.
Routers determine whether the source and destination are on
the same network or whether data must be transferred from
one network type to another, which requires encapsulating the
data packet with routing protocol header information for the
new network type.

Network Topology
Computers in a network have to be connected in some
logical manner. The layout pattern of the interconnections
between computers in a network is called network topology.
Devices on the network are referred to as 'nodes.' The most
common nodes are computers and peripheral devices.
Point-to-Point
Point-to-point topology is the simplest of all the network
topologies. The network consists of a direct link between two
computers. This is faster and more reliable than other types of
connections since there is a direct connection.
Bus
Bus topology uses one main cable to which all nodes are
directly connected. The main cable acts as a backbone for the
network. The first advantage of bus topology is that it is easy
to connect a computer or peripheral device. One of the
disadvantages is that if the main cable breaks, the entire

17
network goes down. This type of network is also difficult to
troubleshoot.
Star
In star topology, each computer is connected to a central
hub using a point-to-point connection. The central hub can be
a computer server that manages the network. Star topology is
very popular because the start-up costs are low. It is also easy
to add new nodes to the network. The network is robust in the
sense that if one connection between a computer and the hub
fails, the other connections remain intact.
Ring
In ring topology, the computers in the network are connected
in a circular fashion, and the data travels in one direction.
Each computer is directly connected to the next computer,
forming a single pathway for signals through the network.
This type of network is easy to install and manage.
Mesh
A network setup where each computer and network devices
are interconnected with one another, allowing for most
transmissions to be distributed even if one of the connections
go down. It is a topology commonly used for wireless
networks.
The 7 Layers of the OSI
In the OSI model, control is passed from one layer to the
next, starting at the application layer (Layer 7) in one station,
and proceeding to the bottom layer, over the channel to the
next station and back up the hierarchy. The OSI model takes
the task of inter-networking and divides that up into what is

18
referred to as a vertical stack that consists of the following 7
layers.

1. Application Layer (Layer 7)


OSI Model, Layer 7, supports application and end-user
processes. Everything at this layer is application-specific. This
layer provides application services for file transfers, e-mail,
and other network software services. Telnet and FTP are
applications that exist entirely in the application level.
Layer 7 Application examples include WWW browsers, NFS,
SNMP, Telnet, HTTP, FTP.

2. Presentation Layer (Layer 6)


This layer provides independence from differences in
data representation (e.g., encryption) by translating from
application to network format, and vice versa. This layer
formats and encrypts data to be sent across a network,
providing freedom from compatibility problems. It is
sometimes called the syntax layer.
Layer 6 Presentation examples include encryption, ASCII,
EBCDIC, TIFF, GIF, PICT, JPEG, MPEG, MIDI.

3. Session Layer (Layer 5)


This layer establishes, manages and terminates
connections between applications. The session layer sets up,
coordinates, and terminates conversations, exchanges, and
dialogues between the applications at each end.
Layer 5 Session examples include NFS, NetBIOS names,
RPC, SQL.

19
4. Transport Layer (Layer 4)
OSI Model, Layer 4, provides transparent transfer of data
between end systems, or hosts, and is responsible for end-to-
end error recovery and flow control. It ensures complete data
transfer.
Layer 4 Transport examples include SPX, TCP, UDP.

5. Network Layer (Layer 3)


Layer 3 provides switching and routing technologies, creating
logical paths, known as virtual circuits, for transmitting data
from node to node. Routing and forwarding are functions of
this layer, as well as addressing, internetworking, error
handling, congestion control and packet sequencing.
Layer 3 Network examples include AppleTalk DDP, IP, IPX.

6. Data Link Layer (Layer 2)


At OSI Model, Layer 2, data packets are encoded and
decoded into bits. It furnishes transmission protocol
knowledge and management and handles errors in the
physical layer, flow control and frame synchronization. The
data link layer is divided into two sub layers: The Media
Access Control (MAC) layer and the Logical Link
Control(LLC) layer.
Layer 2 Data Link examples include PPP, FDDI, ATM, IEEE
802.5/ 802.2, IEEE 802.3/802.2, HDLC, Frame Relay.

7. Physical Layer (Layer 1)


OSI Model, Layer 1 conveys the bit stream - electrical
impulse, light or radio signal — through the network at the
electrical and mechanical level. It provides
the hardware means of sending and receiving data on a carrier,
including defining cables, cards and physical aspects. Fast

20
Ethernet, RS232, and ATM are protocols with physical layer
components.
Layer 1 Physical examples include Ethernet, FDDI, B8ZS,
V.35, V.24, RJ45.

21
4. EPABX

EPABX (Electronic Private Automatic Branch Exchange)


A private branch exchange (PBX) is a telephone
exchange that serves a particular business or office, as
opposed to one that a common carrier or telephone company
operates for many businesses or for the general public. PBXs
are also referred to as PABX – private automatic branch
exchange and EPABX.
The electronic private automatic branch exchange
(EPABX) is equipment that has made day-to-day working in
the offices much simpler, especially in the area of
communication.

Auto conferencing and automatic redialling of numbers


found engaged on the first trial are some of other
advancements in the features of the EPBAX.

22
23
5. COMMUNICATION TO SITES

ONGC has two kinds of sites:


1) Production sites.
2) Drilling sites.
Production sites are permanent whereas drilling sites are
temporary.
To communicate with other sites ONGC uses the following
methods depending on the circumstances in which it needs
to establish these sites
1) VSAT COMMUNICATION.
2) LEASED LINES COMMUNICATION.
3) RADIO COMMUNICATION.
VSAT COMMUNICATION:
VSAT is an acronym for very small aperture terminal. It
is used in areas which are remote and temporary as the
equipment used in this communication is portable.
It contains two parts
1) IDU (Indoor Unit).
2) ODU (Outdoor Unit).
1) IDU: It consists of modem and a switch which are
connected by a LAN cable. As it will process required
data and turn the analogue signal to digital.

24
2) ODU: It consists of
1) Antenna Petals.
2) BUC.
3) LNB.
4) Polarized Feeder.

VSAT (Very Small Aperture Terminal) is


a satellite communications system that serves home and
business users. A VSAT end user needs a box that interfaces
between the user's computer and an outside antenna with
a transceiver which receives or sends a signal to a
satellite transponder in the sky. The satellite sends and
receives signals from an earth station computer that acts as
a hub for the system. Each end user is interconnected with the
hub station via the satellite in a star topology VSAT handles
data, voice, and video signals.

25
LEASED LINE COMMUNICATION:

A leased line is a dedicated communication channel that


interconnects two or more sites. This is a service contract
between a customer and a provider. It acts as a dedicated
tunnel from one point to the other where data can
continuously flow for a fixed monthly fee or rent, hence the
name. Leased lines are used for Internet, data and even
telephone services. They are typically run on fibre optic
cables to provide large bandwidth and speed.

26
RADIO COMMUNICATION:
Radio signals are transmitted by an antenna with a
certain output signal strength or effect as it is called. As the
radio signal is spreading out from the antenna it becomes
weaker and weaker the further away from the sender it gets.
Eventually, the signal strength is so weak that the signal can
no longer be understood by a receiver.

There are many reasons for the weakening of the radio


signal. Here are a few examples:

• As the signal is spreading out the effect of the signal is


also spread out over a bigger area. Much like if you
throw a pebble in a pond the height of the waves
decreases the further out from the impact that the waves
spread.
• Absorption, that the effect or energy of the signal is
simply absorbed by the air itself, the water in the air,
particles or other things so that the energy of the signal is
lost
• Scattering, that the signal is split up after colliding with

particles, objects or edges. One example of scattering


includes how a rainbow can be created when light is split
up into different wavelengths after hitting water droplets
in the air
Radio signals are electromagnetic signals just like light. And
similar to light, radio signals can be reflected by or bounce on
things. This can be both positive and negative depending on
the circumstances. A radio wave can act much like regular
waves in the ocean.

Radio Waves act in the same way. Two radio waves that
meet up will interact with each other to increase and decrease
27
the signal strength. In the following picture we can see two
radio waves (dashed lines) with different wavelengths and
wave heights (amplitude) that meet up, and together they form
a new combined radio wave (solid line) that appear very
different to the original radio waves.

28
6. SCADA

Supervisory control and data acquisition (SCADA) is a


system of software and hardware elements that allows
industrial organizations to:
• Control industrial processes locally or at remote
locations
• Monitor, gather, and process real-time data
• Directly interact with devices such as sensors, valves,
pumps, motors, and more through human-machine
interface (HMI) software
• Record events into a log file

SCADA systems are crucial for industrial organizations since


they help to maintain efficiency, process data for smarter
decisions, and communicate system issues to help mitigate
downtime.

The basic SCADA architecture begins with programmable


logic controllers (PLCs) or remote terminal units (RTUs).
PLCs and RTUs are microcomputers that communicate with
an array of objects such as factory machines, HMIs, sensors,
and end devices, and then route the information from those
objects to computers with SCADA software.

The operator pauses the operation and views the SCADA


system data via an HMI to determine the cause of the issue.

29
SCADA IN ONGC:

1. Rajahmundry asset
(i) Exploration (Drilling)
(ii) Production.
2. Oil is sold to HPCC, BPCL
3. Gas is sold to GAIL.
4. A total of 24 DI and 10 DR.
5. Safety and Optimum parameters
1)pressure sensors
2)Temperature sensors
3)Flow rate
4)Level
6. SCADA
1)Field instruments
2)Communication
3)RTU
4)Servers and HMI

30
31
7. WELL LOGGING BASE

INTRODUCTION:
Well logging is the technique of making petrophysical
measurements in the sub surface earth formations in order to
determine both the physical and chemical properties of rocks
and the fluids they contain.
Well logging or borehole logging is the practice of
making a detailed record (a well log) of the geologic
formations penetrated by a borehole. The log may be based
either on visual inspection of samples brought to the surface
(geological logs) or on physical measurements made by
instruments lowered into the hole (geophysical logs).
Some types of geophysical well logs can be done during any
phase of a well's history: drilling, completing, producing, or
abandoning.
How do they estimate….?

1) Electrical logs
Resistivity log
Borehole Imaging
2) Porosity logs
Density
Neutron porosity
Sonic
32
3) Lithology logs
Gamma ray
Self/spontaneous potential

33
II. PROJECT ON WEB DEVELOPMENT
Abstract:

A project has been done on web designing under our


internship guide Shri A.Satyanarayana, DGM(E & T), ONGC,
Rajahmundry Asset . The topic my group has worked on is to
design a webpage for an educational institution. So, in this
regard, I’ve chosen my institute name for designing for this
page. All the required contents are taken from the original
website.

The project is mainly developed using HTML and CSS,


addition with some predefined JavaScript codes. The code
which we developed here is dealt only with front end
development. In case of future developments, back end can
also be attachable to the framework.

Some of the noteworthy points that this page contains:

• This page works on or above IE 9, Edge 17, Firefox 63


and above, Safari 11 and above, Opera 55, Chrome 65
and above, iOS 10 and above.
• This page is compatible with any type of screen
resolution i.e., mobile, tablet, PC etc… The page

34
contents will be sorted itself accordingly with the screen
resolution.
• In the webpage, in case of top navigation bar, when the
screen resolution is being reduced, it gets being
compressed and finally gets sorted out in form of a
dropdown menu.
Website view

35
• The contents like News, Vision, Mission, Publications
are ordered one after another when the screen resolution
width is below 630px.
• A button is given (an up-arrow mark) in the bottom right
corner of the page, on click, it’ll scroll on the page to top.
• In the news columns, the contents are the links, and on
hover, the will pause the scrolling.
• Slideshow of the photos are also given in the page.
• Private partner images at the bottom aligns themselves
horizontally and vertically, according to the screen
resolution.

Mobile view

36
• In the top navigation bar, for some buttons, drop downs
are assigned, and the contents in that are assigned with a
‘+’ symbol, as its prefix.

Mobile view with top navigation bar in dropdown

37
Private partners alignment at different resolutions

38
Sample Code of HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-
scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" type="text/css" href="designs1.css">
<link rel="icon" href="IIIT-K.png" type="image/x-icon">
<title>IIIT Kottayam</title>
</head>
<body>
<div class="header-content">
<a href="https://www.facebook.com/IIITKtym/" target="_new"><img
src="002-facebook.png" class="fb" title="IIIT-K Official Facebook page"></a>
<a href="https://twitter.com/IIITKtym" target="_new"><img src="twitter.png"
class="twitter" title="IIIT-K Official Twitter page"></a>
<img src="IIIT-K-logo.jpg" class="IIIT-logo" alt="IIIT-K-logo">

<div class="hindi-script">भारतीय&nbsp; सूचना&nbsp; प्रौध्योगिकी


&nbsp;संस्थान, कोट्टायम</div>
<h1>Indian Institute of Information Technology, Kottayam</h1>
<ul class="topnav" id="myTopnav">
<li><a href="#home">Home</a></li>
<li><a href="#about">About IIITK</a></li>
…..

</html>

39
Sample code of CSS:

…..

@media screen and (max-width:1220px) {


.box-property,.privateP{margin: 2%;}
.slideshow-container{margin: 2% 0 2% 2%;}
}
@media screen and (max-width:1145px) {
.box-property,.privateP{margin: 1%;line-height: 1.7em;}
.slideshow-container{margin: 1% 0 1% 1%;}}
@media screen and (max-width:930px) {
[class*="box-"]{float: none;width: 86%;margin: 0 auto;padding: 10px;margin-
bottom: 20px;}
.private-partners{margin: 0 auto;width: 80%;margin-bottom: 40px;}
.slideshow-container{float: none;width: 96%;margin: 0 auto;margin-bottom:
10px;height: auto;}
.slideshow-container img{width: 100%;height: auto;}
.privateP{float: none;width: 86%;margin: 0 auto;}}
@media screen and (max-width:800px) {
.IIIT-logo{width: auto;float: none;margin: 0 auto;display: block;margin-
bottom: 0px;padding-top: 20px;padding-left: 0px;}
h1{margin-bottom: 10px;font-size: 30px;}
}
@media screen and (max-width:680px) {
h1{font-size: 27px;}
.hindi-script{font-size: 22px;font-weight: 500;}
.body-content,.header-content{width: 100%;}
.box-property h2{font-size: 20px;}
…..
40
Code Snippet Images of HTML:

41
Code Snippet Images of CSS:

42
All the work done is uploaded to a sub domain. So where ever
be, we can check this work done in provided link below

iiitktym.000webhostapp.com

43

Das könnte Ihnen auch gefallen