HTML FOR CSS

 Links links are very useful for us. they allows us to move one page to another page. it will make a better experience for user. <a> Links are created with <a> tag element . Users can click Anything between the opening and closing</a> tag. We can specify which page we want to link with href attribution. Linking to Other Website <a href="https://www.wikipedia.org">Wikipedia Home</a> Linking page on  same website <a href="index.html">Home</a> Email Link <a href="mailto:sagar@sagarved.com">Email To Sagar</a> Opening Links in a New Window Target  <a href="google.com" target="_blank">Google Home</a> Linking To a Specific Part in a Same Page To achieve this we  use I'd'. For referencing  A id element we use # and followed by link . <a href="#contact">Contact</a> Linking to a Specific part on Another Page If we want to link a specific part then we r

 Summary of Lists There are three types of HTML lists: ordered, unordered, and definition. Ordered lists use numbers. Unordered lists use bullets. Definition lists are used to define terminology. Lists can be nested inside one another. Example Code Thanks for reading this blog.

 HTML Provides Three Types of Lists . Ordered List - Ordered list are lists where each item in the list is numbered. Unordered List - Unordered lists that begin with a bullet point. Definition List - Definition Lists are made up a set of terms along with the definition for each of those terms.  Ordered Lists <ol> The Ordered list is created with <ol> element. <li> each item in the list is palaced between opening <li> tag and closing </li> tag. <li> stands for list items. Browsers indent lists by default. Unordered List <ul> The Unordered list is created with <ul> element. <li> each item in the list is palaced between opening <li> tag and closing </li> tag. <li> stands for list items. Browsers indent lists by default. Definition list <dl> The definition list is created with <dl> element. inside <dl> element we use <dt> and <dd> elements. <dt> This is used to contain the term being

We are understanding about text. In text we have learnt about how to use headings , paragraphs, How to BOLD , Italic, How to Superscript and subscript and how to creat Line breaks. In sementic  Markups we study strong and emphasis, quotation,abbreviation&Acronyms , Citation and definations , Author's Address and change in content. Here i attached a page . The Code The HTML Page Thank you for coming Here . For practing this you can choose Wikipedia pages.

These are  some text element that are intended to affect the structure of your page , but they add extra information to the pages-they are known as Semantic markup. 1. STRONG AND EMPHASIS <strong> The Use of the  <strong> element indicates that its content has strong importance. Browsers show <strong> element in "Bold" By Default. <em> The <em> element indicates emphasis that subtly changes the meaning of sentence. Browsers show <em> element in "Italic" By Default. 2. Quotation These are the two type of quotations <Blockquote> The <blockquote> element is used for or longer quotes that takes up an entire paragraph. <q> The <q> element is used for shorter quotes that sit within a paragraph browsers are supposed to quotes around the q element. 3. Abbreviations & Acronyms <abbr> If you use an abbreviations or an acronyms , then the <abbr> element can be used. A title attiribute on the opening ta

Line Breaks & Horizontal Rules <br/> As you have already seen, the browser will automatically show each new paragraph or heading on a new line. But if you wanted to add a line break inside the middle of a paragraph you can use the line break tag <br/> . line break <hr/> To create a break between themes — such as a change of topic in a book or a new scene in a play — you can add the horizontal rule between sections using the <hr /> tag.                                 horizontal rule There are a few elements that do not have any words between an opening and a closing tag. They are known as empty elements and they are written differently.  An empty element usually has only one tag. Before the closing angled bracket of an empty element, there will often be a space and a forward slash character. Some web page authors miss this out but it is a good habit to get into. next> semantic markup Enjoy 

white space collapsing WHITE SPACE COLLAPSING In order to make code easier to read, web page authors often add extra spaces or start some elements on new lines. When the browser comes across two or more spaces next to each other, it only displays one space. Similarly, if it comes across a line break, it treats that as a single space too. This is known as white space collapsing. You will often see that web page authors take advantage of white space collapsing to indent their code in order to make it easier to follow. EXAMPLE: WHITE SPACE COLLAPSING

BOLD AND ITALIC <b>...</b> THIS IS BOLD TEXT By enclosing words in the tags <b> and </b> we can make characters appear bold. The <b> 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 <b> element does not imply any additional meaning. <i>...</i> THIS IS ITALIC TEXT By enclosing words in the tags <i> and </i> we can make characters appear italic. The <i> 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. BOLD  AND ITALIC SUPERSCRIPT AND SUBSCRIPT ^... The <sup> element is used  to contain characters that  should be superscripts such  as the suffixes of dates or  mathematical concepts like  raising a number to a power such

HEADINGS: <h1> <h2> <h3> <h4> <h5> <h6> There are six levels of headings. <h1> is used for main headings <h2> is used for subheadings If there are further sections under the subheadings then the <h3> element is used, and so on... Browsers display the contents of headings at different sizes. The contents of an <h1> element are the largest, and the contents of an <h6> element are the smallest. The exact size at which each the browser shows the headings can vary slightly. Users can adjust the size of the text by using CSS. HEADING LEVELS PARAGRAPHS: To create a paragraph, surround the words that make up the paragraph with an opening <p> tag and closing </p> tag. By default, a browser will show each paragraph on a new line with some space between it and any subsequent paragraphs. paragraph next> Bold & italic and scripts(sub&super) Enjoy  😀 For more blogs related to technology you can visit Relatete

When creating a web page, we add tags (known as markup) to the contents of the page. These tags provide extra meaning and allow browsers to show users the appropriate structure for the page. Structural markup:  The element that you can use to describe both headings and paragraphs. Semantic markup: Which provides extra information such as where the emphasis is placed in a sentence that something you have written is a quotation (and who said it) the mean of acronyms and so on. Next > HEADINGS AND PARAGRAPHS Enjoy  😀 For more blogs related to technology you can visit Relatetechno.codes

Summary HTML pages are text documents. HTML uses tags (characters that sit inside angled brackets) to give the information they surround special meaning. Tags are often referred to as elements. Tags usually come in pairs. The opening tag denotes the start of a piece of content; the closing tag denotes the end. Opening tags can carry attributes, which tell us more about the content of that element. Attributes require a name and a value. To learn HTML you need to know what tags are available for you to use, what they do, and where they can go. For more blogs related to technology you can visit Relatetechno.codes

HOW TO CREAT OWN FIRST PAGE Follow these step to create own HTML web page 1. Open your text editor              mac: text editor  windows: notepad  Linux: text editor 2. Write your code 3. Save your file with .html extension           (example: myfirstpage.html) 4. Now, go to your saved file and double click on that. 5. your result on the screen IF you don't have any computer,you can try on your android mobile. 1. Go to play store. 2. Download text editor.(download anwriter free html editor) continue with above steps. or  you can try Codepan.io Enjoy.... For more blogs related to technology you can visit Relatetechno.codes

ATTRIBUTES TELLS US MORE ABOUT ELEMENTS Attributes provide additional information about the contents of an element. They appear on the opening tag of the element and are made up of two parts: a name and a value , separated by an equals sign. HTML5 allows you to use uppercase attribute names and omit the quote marks, but this is not recommended. Attribute example 1 More about Attributes  The attribute name indicates what kind of extra information you are supplying about the element's content. It should be written in lowercase. The value is the information or setting for the attribute. It should be placed in double-quotes. Different attributes can have different values. Here an attribute called lang is used to indicate the language used in this element. The value of this attribute on this page specifies it is in US English. The majority of attributes can only be used on certain elements, although a few attributes (such as lang ) can appear on any element. Most attribute values are

SRUCTURE OF PAGE  HTML CODE  <html> <head>           <title> This is the Title of the Page </title> </head> <body> <h1> This is the Body of the Page </h1> <p> Anything within the body of a web page is displayed in the main browser window. </p> </body> </html> RESULT BODY, HEAD, TITLE <body> Anything within the body of a web page is displayed in the main browser window. <head> Before the <body> element you will often see a <head> element. This contains information about the page (rather than information that is shown within the main part of the browser window that is highlighted in blue on the opposite page). You will usually find a <title> element inside the <head> element. <title> The contents of the <title> element are either shown in the top of the browser, above where you usually type in the URL of the page you want to visit, or on the tab for that page (if your b

You can see an HTML code Below. If you Don't understand Than Don't worry, remember we just started our journey. There are two types of tags. one is opening tag and one is closing tag.in the code you see red and yellow text that called tags. All red tags are opening tags and all yellow are closing tags. CODE   <html> <body> <h1> This is main heading </h1> <p> This text might be an introduction to the  rest of the page. And if the page is a long one it might be split up into several sub-headings. </p>  <h2> This is a sub-heading </h2> <p> Many long articles have sub-headings. so to help you follow the structure of what is being written, There may even be sub-sub-heading(or lower-level headings). </p> <h2> This is another sub-heading </h2> <p> here you can see another sub-heading. </p> </body> </html> For more blogs related to technology you can visit Relatetechno.codes

We come across all kinds of documents every day of our lives. Newspapers, insurance forms, shop catalogs... the list goes on. Many web pages act like electronic versions of these documents. For example, newspapers show the same stories in print, as they do on websites; you can apply for insurance over the web; and stores have online catalogs and e-commerce facilities. In all kinds of documents, the structure is very important in helping readers to understand the messages you are trying to convey and to navigate around the document. So, in order to learn how to write web pages, it is very important to understand how to structure documents.  How HTML describes the structure of a web page Learn how tags or elements are added to your document Write your first web page For more blogs related to technology you can visit Relatetechno.codes