TECHNOLOGY FREAK

  How we can insert CSS in HTML code? There are 3 ways to insert  CSS in HTML to style webpage inline, internal and external CSS. Let’s understand this three types of CSS. 1. Inline CSS : Inline CSS can be inserted in HTML by using style attribute. All container tags have style attribute. Inline CSS design is only applied to element in which style attribute is used. Inline CSS is not much recommended to use for styling multiple elements because this make HTML code more complex and it becomes difficult to maintain styling and content. HTML Code will be easy to understand if content and styling are separated. Syntax is <tag style="";>content<tag>     (the code is written big to realize that how inline style can complicates the HTML code) 2. Internal CSS : Internal CSS can be inserted in HTML by using <style> tag in head section of HTML document. With internal CSS we can apply style sheet on a page where style tag is used i.e. it can apply style sh...

  What is CSS and for what purpose it is used? CSS stands for cascading style sheet and it is used to design webpage, to give a beautiful appearance to the webpage. It also defines proper orientation of entities in a webpage or it allows sort the content.  CSS is used for advanced webpage designing which is impossible by using HTML formatting elements and various attributes. CSS allows to separate content from a style which improves readability. We can insert CSS  with help of HTML code, to use CSS you need to have basic knowledge about HTML like container tags and their attributes, linking one page to another, inserting images, and colors.  We can insert CSS in HTML by 3 different types: 1. Inline CSS  2. Internal CSS 3. External CSS (We will see them in later posts.) There are some attributes in lower versions of HTML which are not used or they are deprecated. HTML5 recommends styling webpages with CSS. CSS3 is current major version of CSS and it is su...

  What is Image mapping in HTML and How to map images?: A single image with multiple hyperlinks is called as a image mapping. Specific areas of image are mapped known as Hotspot and each hotspot is a link. Image mapping is of two types client side image map and server side image map.  Client side image map is independent of server and executes on client machine. All information in client side image  map is loaded with image. It is faster than server side map. Usemap attribute of img  tag identify that it is client side image map., while ismap attribute of img tag refers to server side image map. Usemap attribute of <img>, <map>, <area> this elements are used to create hyperlinks or a hotspot on image.  Attribute of map tag is name which specifies name to the image. Attributes of area tag:         1. Href: path or url of html page        2. Shape: Specifies shape and have value...

Understanding some special elements in HTML:- • HTML characters: there are characters in HTML which are reserved. This character can be used for some specific symbol or a function. This can be done with &entity_name;  It is not possible to display some elements in browser like <a> because it is identified as a tag so it will be included in code. To display this we use special characters to display it in a browser. As you know that if you write  <> in a code browser will not display it as it will included in HTML code. To display this in a output or in browser we use HTML characters. Some examples of HTML characters:-           1. spacing: &nbsp To add space between two elements.           2. < : &it To Display Less Than.           3. > : &gt To Display Greater Than.       ...

  What is Iframe tag in HTML and Why it is Used?: Iframe tag in HTML used for embedding or inserting a inline frame which can contain document in a webpage. (In lower version frameset tag used for dividing browser into frames and frame tag indicates a frame. In html5 frameset and frame both tags are unsupported.)  Attributes of iframe tag are as follows:- 1. Src: this attribute specifies location of document to be displayed in inline frame. 2. Width:- width of inline frame 3. Height:- height of inline frame 4. Name: assign name to the iframe 5. Srcdoc: this attribute specifies content of html code page to show  

  What are Meta tags in HTML and why they are important?. Meta tags are used to displays information which is visible in search result. This information is used by search engine for understanding webpage to give better results and improve search engine optimization.  This information is not displayed in output or webpage. Meta tag is empty element and present within head tag. Attributes of meta tag are as follows: 1. Name: specifies name of Metadata like author name, description, keyword and copyright. 2. Content: this attribute specifies information about name attribute  3. Char Set: this attribute specifies character encoding used by document called as character encoding declaration. 4. http-equiv: this attribute used for addition of  information in http header This can have values refresh(refresh page after some time), set cookies(send cookies to server), content type(Specifies the character encoding for the document) . expires(session will expired after s...

  What are Semantic or section tags in HTML?:  In HTML section allow us to group HTML elements. For grouping many HTML elements div tag is used and for grouping few HTML elements. Div tag is block level element and creates a block in webpage while span tag is inline level element and this elements does not start on new line. Semantic tags in HTML:  HTML5 introduces semantic tags to customize content in proper sequence or order like blocks. It is optional to use semantic elements div and span element do the same work as they do.  Following are semantic tags: 1. <header>: this attribute helps to create a header. 2. <nav>: this Attribute helps to create navigation bar in webpage. 3. <section>: this attribute creates section in webpage. 4. <article>: this attribute help to insert article in webpage. 5. <aside>: this attribute help to creates sidebar. 6. <Footer>: this attribute help to create footer. 7. <details>: t...

  How to inset Audio and video files in HTML using audio and video tags? For inserting audio in HTML <audio> tag is used. In lower version of HTML embed and bgsound tags used for inserting audio files in webpage.  For inserting video in HTML <video> tag is used. In lower HTML version embed and img dynsrc are used for embedding video in webpage.  Attributes of audio tag are as follows: 1. Src : provides location or source of audio file. 2. Controls : this attribute provides an console with play, pause, forward, button as we play music on any music player. 3. Loop : this attribute used for playing audio in assigned value times if loop=2 then audio file will be played two times after finishing  4. Muted : this attribute is used for muting audio 5. Autoplay : this attribute is used for auto playing audio when user open webpage. Source tag is used for adding multiple audio files in webpage. Attributes of video tag are:  1. Src : this attri...

  What is a List and How to create in HTML? List is nothing but any content arranged in specific order like following. 1. A  2. B 3. C Lists are of two types ordered and unordered . Now you know what is list but how to create lists in HTML? To create lists in HTML <li> tag is used. But in which manner lists is arranged depends on type of lists. <li> tag is a container tag. <ul> tag used for unordered lists and displayed as bullets. This tag has attribute type which define type of bullet and its values are circle, disc, square. Default value is disc.  <ol> tag used for ordered lists and displayed in a proper order.  Following are attributes of <ol> tag: 1. Type : this attribute used to define a order type in list and has value 1, I, i, A, a.  Default value for ordered list is 1. 2. Reversed : this attribute defines a order in reversed manner. 3. Start : this attribute defines a number from which order is started. Lists...

  What is <Select> tag and How to use? :  <select> tag is used to create drop-down list or scrolling list. This allows user to select option from drop-down or scrolling list. This is also a container tag. Following are attributes of <select> tag: 1) Name – It  assigns name or identity to the option used has been selected. 2) Multiple - this allows the user to  select more than one option or value from given drop-down list. 3) Size – This attribute is used to specifying  number of visible option or value Each options in drop-down or scrolling list is created using option tag which is enclosed within select tag. The attributes of <option> tag are : 1) selected : it define auto-selected option. 2) value : It assigns value to the option displayed in the drop-down or scrolling list.  Hidden fields: Hidden fields stores a value which sent to the server but doesn’t displayed on web browser or to a user. Hidden is the value of attribute type...

What is <Textarea> tag in HTML and How to use?   :   • The <textarea> tag used to create a multi-line textbox. • With the  help of this tag user can fill detailed form with multi-line characters. It is also a container tag and have opening and closing tag.   Following are attributes of textarea tag:         1. name : It is used to assign name for the textarea when user submit data.         2. rows : This attribute specifies the number of lines in a textarea.         3. cols : this attribute specifies the width of a text area. Both have values in numbers.         4. Maxlength : This attribute specifies the maximum number of characters allowed in the textarea.         5. placeholder : this attribute provides a hint that describes the expected value of a textarea.    ...

  Using The <Input> tag in HTML :-  This tag is used to create a input or text field. It allows user to fill data in given field. The <Input> tag with the help of attributes gives different types of input fields. This tag has no end. The default value for input type is text.   Syntax of input tag is <input attribute=”value”>   Attributes of <Input>: 1.   Type : It describes, the name of the control like text, radio etc. Following are examples of input type value      <Input type = "text">:- This creates a one line textbox            <Input type = "radio">: This creates a radio button. The radio button allows one option selection from multiple choices.          <Input type = "checkbox">: This creates a checkbox. It allows more than one selection from multiple choices.           ...