Skip to main content

Transport Layer Protocols

There are two fundamental protocols in the transport layer  1. TCP Transmission Control Protocol-- connection-oriented protocol 2. UDP User Datagram Protocol -- connectionless protocol Connection-oriented communication : establishes a logical (virtual) connection prior to sending data. Connectionless communication : sends data right away without establishing a logical connection Qn why do we have transport layer protocal?  IP provides a weak, but efficient service model (best-effort ) How should hosts send into the network?      i.)Flow Control      ii.) Too fast is bad; too slow is not efficient IP packets are addressed to a host           How to decide which application gets which packets?         NOTE TRASPORT LAYER IS RESPONSIBLE FOR PROCESS TO PROCESS DELIVERY PORTS port is a communication endpoints  Since there are many applications running on a co...

web application

 What is HTML? HTML stands for HyperText language HTML is that the standard nomenclature for creating websites HTML describes the structure of an internet page HTML consists of a series of elements HTML elements tell the browser a way to display the content HTML elements label pieces of content like "this may be a heading", "this may be a paragraph", "this may be a link", etc. What is HTML? HTML stands for HyperText Markup Language HTML is the standard markup language for creating Web pages HTML describes the structure of a Web page HTML consists of a series of elements HTML elements tell the browser how to display the content HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.


 Simple HTML Document

Example

<!DOCTYPE html>

<html>

<head>

<title> Title</title>

</head>

<body>

<h1>My  Heading</h1>

<p>paragraph.</p>

</body>

</html>

The History of HTML

HTML was first created by Tim Berners-Lee, Robert Cailliau, and others starting in 1989. It stands for HyperText Markup Language.


Hypertext means that the document contains links that allow the reader to jump to other places in the document or to another document altogether. The latest version is known as HTML5.


A Markup Language is a way that computers speak to each other to control how text is processed and presented. To do this HTML uses two things: tags and attributes.




What are Tags and Attributes?

Tags and attributes are the basis of HTML.


They work together but perform different functions – it is worth investing 2 minutes in differentiating the two.


What Are HTML Tags?

Tags are used to mark up the start of an HTML element and they are usually enclosed in angle brackets. An example of a tag is: <h1>.


Most tags must be opened <h1> and closed </h1> in order to function.


What are HTML Attributes?

Attributes contain additional pieces of information. Attributes take the form of an opening tag and additional info is placed inside.


An example of an attribute is:


<img src="mydog.jpg" alt="A photo of my dog.">


In this instance, the image source (src) and the alt text (alt) are attributes of the <img> tag.


HTML has six "levels" of headings:


which are  


<h1>


<h2>


<h3>


<h4>


<h5>


<h6>


Note text size decreases for h1 to h6 


Bold & Italic


By enclosing words in the tags<b>and</b>   we can make characters appear bold. The element also represents a section of text that would be presented in a visually different way (for example keywords in a paragraph) although the use of the element does not imply any additional meaning.


<I>


By enclosing words in the tags<i>  and </i> we can make characters appear italic. The element also represents a section of text that would be said in a different way from surrounding content — such as technical terms, names of ships, foreign words, thoughts, or other terms that would usually be italicized.


<sup>


The <sup>  element is used to contain characters that should be superscript such as the suffixes of dates or mathematical concepts like raising a number to a power such as 2.


<div>


The div tag is used for dividing the webpage  into the different division as the programmer want for more information see this video


<iframe> 


The <iframe> tag specifies an inline frame.


An inline frame is used to embed another document within the current HTML document.


Tip: you must include the iframe title in your iframe


example:<iframe src="http://ontrendtz1.epizy.com/" title="techdelers website"></iframe>


<img>


 Images help to  improve the design and the appearance of a web page.


how to use img tag in HTML example <img src="ombeni.png" alt="this is my photo">


<table>


This help  web developers to arrange data into rows and columns.


example 




Company          Contact                  Country


Ozata                 ombnei Zakaria Tanzania


Techdelers               tech                          USA


The <form> 


The HTML <form> help to  create  user input:


<form>


<input type="text">


</form>


Example of form: 


<form>


  <label for="fname">First name:</label><br>


  <input type="text" id="fname" name="fname"><br>


  <label for="lname">Last name:</label><br>


  <input type="text" id="lname" name="lname">


</form>


<Video>


The HTML <video> element is used to show a video on a web page.


Example 


<video width="320" height="240" controls>


  <source src="videoPath.mp4" type="video/mp4">



</video>








Examples

How to create a navigation bar in HTML and CSS 

HTML 

<ul id="navbar">

    <li><a href="/tests">Tests</a></li>

    <li><a href="/studyroom">Q & A Forum</a></li>

    <li><a href="/flashcards">Interview QnA</a></li>

    <li><a href="/library">Tutorials</a></li>

    <li><a href="/testimonials">Testimonials</a></li>

</ul>

css


#navbar {


    list-style-type: none;


    margin: 0;


    padding: 0;


    width: 200px;


    background-color: #EEEEEE;


}




ul#navbar li a {


    display: block;


    color: #000000;


    font-weight:bold;


    padding: 8px 16px;


    text-decoration: none;


}




ul#navbar li a:hover {


    background-color: orange;


    color: white;


}


ul {


    list-style-type: none;


    margin: 0;


    padding: 0;


    width: 200px;


    background-color: #EEEEEE;


}




li a {


    display: block;


    color: #000000;


    font-weight:bold;


    padding: 8px 16px;


    text-decoration: none;


}




li a:hover {


    background-color: orange;


    color: white;


Comments