Posts

Showing posts with the label html

HTML table Tag

Image
HTML table allows us to represent the data in row and column form.  Define an HTML Table <table> tag is used to create table along with <tr> , <td> and <th> for table rows, columns and header respectively. <table> tag attributes: caption : This is used to give a name to the table. e.g. <caption>My Table</caption> border : This attribute is used to give the border to the table. It has values in pixels. bordercolor : This is used to give the color to the border. e.g. bordercolor="color_name" align : This is used to set the alignment of the table i.e. left, right and center. Example: <table border="2" bordercolor="red" align="center"> <caption>Students</caption>>      <tr>           <th>S.No.</th>           <th>Name</th>      </tr>      <tr>       ...
Post a Comment
Read more

HTML video Tag

Image
How to add video to your HTML web page HTML provides <video> tag to embed video in your web page. It's a paired tag so you need to add both opening and closing video tags. Within video tag, <source> tag is used to provide source of video using src attribute. type attribute specifies type of video file. Example: <video> <source src="nature.mp4" type="video/mp4"> </video> This tag is compatible with MP4, WebM, and Ogg file types. To avoid video codecs and browser compatibility issues, it's best that you add multiple sources to the video. If the browser cannot show the video, it will display the text you write between them. <video> Tag Attribute: controls specifies whether the video should have player control buttons (play, pause, volume, etc.). <video controls > <source src="nature.mp4" type="video/mp4"> </video> poster  specifies whether a certain image will be shown while the video is...
Post a Comment
Read more

HTML | Frameset Tag | Attributes

Image
In our previous blog  Frameset Tag , we already learnt about Frameset tag and its 2 attributes - cols and rows. Here we will learn about few more attributes: bordercolor :               With this attribute, you can specify color of border between frames.           example :              <html>      <frameset cols="20%,30%,*" bordercolor=Red> <frame src="frame1.html"> <frame src="frame2.html"> <frame src="frame3.html">      </frameset>           </html>          Output : frameborder  :             With this attribute, you can specify whether border between frames should displayed or not.               It can take 2 values,  0 - No border 1 - B...
Post a Comment
Read more

Which HTML tag is used to give strikethrough effect to text?

 Two HTML tags are available to give strikethrough effect to text. 1. <s> The   <s>   tag specifies text that is no longer correct, accurate or relevant. The text will be displayed with a line through it. For example, you have seen product prices strike out during Sale period to reflect discounted price. Sale Price Rs. <s>100</s> 80 Output: Sale Price Rs. 100 80 2.  <del> <del> tag also works in same manner. Sale Price Rs. <del>100</del> 80 Output: Sale Price Rs. 100 80
Post a Comment
Read more

HTML | frameset Tag

Image
In this tutorial, you will learn how to divide browser window into multiple sections with each section having its own content. HTML <frameset> Tag The <frameset> tag in HTML is used to define the frameset. The <frameset> element contains one or more frame elements. Syntax: <frameset cols = "pixels|%|*"> Attributes: cols : The cols attribute is used to create vertical frames in web browser. This attribute is basically used to define the no of columns and its size inside the frameset tag. rows : The rows attribute is used to create horizontal frames in web browser. This attribute is used to define no of rows and its size inside the frameset tag. Value of cols and rows can be provided in pixels, % or *. Creating Vertical Frames To create a set of vertical frames, we need to use the frameset element with the cols attribute. The cols attribute is used to define the number and size of columns. We have three files to display in different sections vertically. ...
Post a Comment
Read more

HTML Anchor <A> Tag Attributes

Image
What are links in HTML -  HTML Links - Hyperlink How to create links to different sections of same page -  connecting sections of same page In this tutorial, we tutorial you will learn about different attributes of anchor <a> tag. Hyperlink Attributes title :  Defines the title of a link, which appears to the user as a tooltip. <a href=" https://cstutorials1.blogspot.com/2020/10/how-to-create-links-to-sections-on-same.html " title="info_about_link"> content visible as link</a> Output:  content visible as link target : Specifies where to open the linked URL. It can have 4 values. _self - opens the linked URL inside same window or tab (default) _top - opens the linked URL in top most frame of the window.     _parent - opens the linked URL in parent frame of the window. _blank - opens the linked URL in new tab or window. download : Prompts the user to download the linked resource instead of opening in new tab/window. <a href"addres...
Post a Comment
Read more

How to create links to sections on the same page in HTML

Image
HTML Hyperlinks are used to navigate from one web page to another. We can also use same <a> anchor tag to jump between different sections of same web page. To know how to insert hyperlink to navigate within different page, go through  HTML Links . In this tutorial you will learn how to link one section to another section on a same web page. Internal Links In case of long pages, we can help users to explore page by using internal links without scrolling. User can jump between different sections of page on single click. Internal links/page jumps use the same <a>  tag and href attribute. Link provided as value of href attribute points to particular section of page. Syntax Page jumps are done by using the name attribute of the a element. suppose we need a link to the top of your page, you would add an anchor like this near the top of your document. <a name="name_attribute_value"></a> There doesn’t need to be anything between the opening and closing tags....
Post a Comment
Read more

HTML Links

Image
In this tutorial, you will learn how to link one web page to another in HTML. Creating Links in HTML A link or hyperlink is a connection from one web resource to another. Links allow users to move seamlessly from one page to another. A link has two ends, called anchors. The link starts at the source anchor and points to the destination anchor, which may be any web resource, for example, an image, an audio or video clip, a PDF file, an HTML document or an element within the document itself. HTML Link Syntax Links are specified in HTML using the <a> tag ie anchor tag. It is paired and inline tag. A link or hyperlink could be a word, group of words, or image. <a href="url">Link text</a> Anything between the opening <a> tag and the closing </a> tag becomes the part of the link that the user sees and clicks in a browser. The most important attribute of the <a>  tag is the href attribute, which indicates the link's destination. It's value...
Post a Comment
Read more

How to create Nested List in HTML

Image
Nested List HTML provides a way to create a list inside another list . That is called nesting of lists. In this we can use <ul> tag inside <ol> tag and vice-versa. Using this we can create multiple lists inside one list.
Post a Comment
Read more

How to create description list in HTML

Image
HTML Description List In previous tutorials you learnt about Ordered and Unordered List. There is one more type of list in HTML i.e. description list. In this list, we have three tags <dl> (description list), <dt> (description term) and  <dd> (description data) tag.  Description list starts with the <dl> tag. It defines description list.  Inside <dl> tag, <dt> tag is used which is used to define the term which we want to describe in our list. After this, <dd> tag is used to define the description or definition of the following term inside the <dl> tag.
Post a Comment
Read more

How to create an unordered list in HTML ?

Image
HTML Unordered Lists An unordered list is a list in which the order of the list items does not matter. If you change the order of items that would not change information you want to convey to user. In this tutorial you will learn about creation of unordered list in html Unordered List <ul> tag is used to create Unordered List in HTML. In unordered list, list items identified by some symbols or bullets. This is also known as bulleted list. Unordered list start with <ul> tag and closed with </ul> tag. <li> tags are used to add list items to our list. Syntax: <ul>   <li>HTML</li>   <li>CSS</li>   <li>SQL</li> </ul> Output: HTML CSS SQL Unordered list - attributes type - this attribute is used with <ul> tag to specify the type of bullet you like. By default, it is a disc. It can take following three values : disc circle square. By default, its value is disk . Output with circle: HTML CSS SQL Outpu...
Post a Comment
Read more

How to create ordered list in HTML

Image
HTML List When we want to use a list on a website, HTML provides three different types to choose from: unordered, ordered, and description lists. In this tutorial, you will learn how to create ordered list in HTML. Ordered List Ordered list start with <ol> tag. < li> tag to add list items to ordered or unordered list. By default, list items are marked with numbers. Syntax <ol> <li> first </li> <li> second </li> <li> third </li> </ol> Output will be: first second third Ordered list have three attributes: type, start and reversed Start Attribute The start attribute defines the number from which an ordered list should start. By default, ordered lists start at 1. However, there may be cases where a list should start from another number. When we use the start attribute on the <ol> element, we can identify exactly which number an ordered list should begin counting from. <ol start= 11 > <li> first </li...
Post a Comment
Read more

Learn Marquee tag with it's attributes in html

Image
Marquee is one of the important tags introduced in HTML to support scrolling texts and images within a web page. In this tutorial, you will be learning about the Marquee tag and its different attributes for developing a web page. HTML <marquee> tag Html <marquee> tag is used to scroll text or image horizontally across or vertically down your web page. Syntax: The marquee element comes in pairs. It means means that the tag has opening and closing elements. <marquee> CS Tutorials Blogs </marquee> Output: CS Tutorials Blogs It has various attributes like direction, behavior, width, height, bgcolor. Let's see all of these one by one with example. direction attribute: By default direction of scrolling is left means content will scroll toward left. You can set it's value to left, right, up or down. <marquee direction=" right "> CS Tutorials Blogs - scrolling right </marquee> Output: CS Tutorials Blogs - scrolling right <marqu...
Post a Comment
Read more

Insert image in HTML page

Image
HTML <img> tag The <img> tag is used to embed an image in an HTML page. Images are not technically inserted into a web page; images are linked to web pages. It is a unpaired tag.  It has various attributes like: src, width, height, title, alt, border. src attribute indicates the source, source image name or full path of the source image is given as a value to src attribute. width attribute is used to set the width of the image. height attribute is used to set the height of the image. title attribute: when we mouse over the image the value given to the title attribute is displayed as a tool tip. border attribute used to set the border to image. alt attribute is used to give an alternate text for the image, when source image is not available at specified location then alternate text will get display in place of the image. Example < html > < body > < img src = "shape.jpg" alt = "Shape" width = "400px" height = "450px...
Post a Comment
Read more

HTML Tags

Image
In this tutorial, you will learn about most commonly used tags in HTML. Most commonly used tags in HTML HTML document contains lots of predefined tag and we will learn about few of them here: HTML Tag is a command which is used for some specified purpose and those purposes are predefined by default. With the help of tags, web browser can distinguish between an html content and a simple document. Tag mainly consists of three parts: opening tag, content and closing tag. In case of few tags we have exception, they do not have closing tag. Content : Content is the matter which we write between opening and closing tags. Syntax <tag> content </tag> We have 2 types of tags: 1. Paired Tag : These tags come in pairs. That is they have both opening(< >) and closing(</ >) tags. 2. Unpaired Tag : These tags do not required to be closed. We will go through basic tags required to create a html document. <html> Defines an HTML document. <head> This contain...
Post a Comment
Read more

HTML Introduction

Image
What is HTML HTML stands for Hypertext markup language which is used for  creating web pages and web application. You can create static website using HTML. For greater visual and interactive experience, it is used along with CSS and scripting languages like JavaScript. HTML is a markup language, means using html tags it can mark text to be more interactive and dynamics. you can create links, tables, display images etc. Brief History of HTML In the late 1980's , a physicist, Tim Berners-Lee who was a contractor at CERN, proposed a system for CERN researchers. In 1989, he wrote a memo proposing an internet based hypertext system. Tim Berners-Lee  is known as the father of HTML. The first available description of HTML was a document called "HTML Tags" proposed by Tim in late 1991. The latest version of HTML is HTML5, which we will learn later in this tutorial. HTML Tags HTML tags are building block of html. HTML tags are keywords surrounded by angle brackets like <html...
Post a Comment
Read more