Chapter: 07. Html An Introduction
One Touch Learn
A. Tick (✓) the correct option.
Which of the following languages is used to create web pages? Which of the following is the primary purpose of hypertext? Which of the following is incorrect? Naren has used the following code in his web page:
body(background-color: #AAFFHH;)
What does #AAFFHH represent in the above code? b. Hexadecimal code for colour Which of the following are valid ways to apply CSS styles in an HTML document? B. Write ‘T’ for true and ‘F’ for false.
HTML5 was released in 2010. F (It was released in 2014 as a W3C Recommendation) HTML is a case-sensitive language. F (HTML is not case-sensitive) Tag names in HTML should not contain spaces. The text written inside <TITLE> tag appears on the status bar of web browser. F (It appears on the Title Bar/Tab of the web browser, not the status bar) In CSS, a semicolon is used to separate one property-value pair from another. C. Fill in the blanks using the words given below:
Hints: markup, body, inline, background-image, empty
HTML is a markup language that describes the structure of the web page. <BR> tag is an example of empty tag. The body section contains information which is to be shown on the web page. An inline style is used to apply a unique style to a single element. The background-image property is used to set an image as the background of a web page. Let’s Do It
A. Short answer type questions.
What is the latest version of HTML? The latest version of HTML is HTML5. What does signify or point to an HTML tag to which a style will be applied? In CSS syntax, the selector signifies or points to an HTML tag to which a style will be applied. What is a combination of an opening tag, content, and a closing tag called? A combination of an opening tag, content, and a closing tag is called an element. What is a property that provides some additional information about a tag? An attribute is a property that provides some additional information about a tag. B. Long answer type questions.
What does HTML stand for? HTML stands for Hypertext Markup Language. Write the code to include the reference of the mystyle.css file in an HTML web page. To include the reference of the mystyle.css file in an HTML web page, you would use the following code within the <head> section: <head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
When can we use internal style sheets? We can use an internal style sheet when only one web page has a unique style that is not shared with other pages on the website. This style sheet is defined within the <style> tags, placed inside the <head> section of that specific HTML document. C. Application-based questions.
Raj has thought of designing a webpage and he finds aligning of text as a crucial part of beautifying a webpage. Following his thoughts he comes across two things used in HTML one is ALIGN attribute used with various tags and another is CENTER tag. Specify what is the purpose of each and how both are important. You must also discuss the similarities and differences. Purpose of ALIGN attribute: The ALIGN attribute was historically used with various HTML tags (like <p>, <h1>, <img>, <table>, etc.) to specify the horizontal alignment of the content within that tag (e.g., left, right, center, justify). Its purpose was to control the positioning of text or elements. Purpose of CENTER tag: The <center> tag was a specific HTML tag used to center block-level content, typically text and images, horizontally on a page. Any content placed between <center> and </center> would be displayed in the middle of the browser window. Both the ALIGN attribute (with center value) and the <center> tag were used to achieve horizontal centering of content on a web page. They both aimed to control the visual layout and beautify a webpage by improving text alignment. Nature: ALIGN is an attribute that modifies the behavior of other tags, while <center> is a standalone HTML tag. Scope: The ALIGN attribute could be applied to many different tags to align their specific content. The <center> tag was a container that applied centering to all content placed inside it. Modern Usage/Deprecation: The ALIGN attribute and the <center> tag are both deprecated in HTML5. This means they are no longer recommended for use because CSS (Cascading Style Sheets) is the preferred and more powerful method for controlling layout and presentation. For alignment, CSS properties like text-align: center; (for text) or margin: auto; display: block; (for block elements) are used instead. HTML is now primarily for structuring content, while CSS is for styling it. When Chinmay tries to open a webpage after it is saved, he sees the browser executing the HTML code. Chinmay is in dilemma as to how to modify its code because every time he clicks on to the file browser opens up. Help him out as to how to open a saved HTML code for editing? Chinmay needs to open the HTML file in a text editor to modify its code, not directly in a web browser. Here are the steps to help him: Locate the HTML file: Go to the folder where he saved his HTML file (e.g., mywebpage.html). Right-click on the HTML file. From the context menu that appears, select “Open with”. A sub-menu will show a list of programs. He should choose a text editor like Notepad (on Windows), Wordpad, or a more advanced code editor if he has one installed (like VS Code, Sublime Text, Atom, etc.). Once opened in the text editor, he can make changes to the HTML code. After making changes, he must save the file (Ctrl + S). To see the updates, he should then open the file in his web browser as usual, or if it’s already open, simply refresh the browser tab (by pressing F5 or clicking the refresh icon). Higher Order Thinking Skills (HOTS)
Classify the following HTML tags as block level, or text level: <P>, <SUB>, <B>, <H2>, <HR>. Justify your classification for each tag. <P> (Paragraph): Block Level Tag Justification: It creates a new block of content and typically takes up the full width available. It always starts on a new line and adds vertical space before and after itself, separating it from surrounding content. <SUB> (Subscript): Text Level (Inline) Tag Justification: It applies a formatting style (subscript) to a small portion of text within a line. It does not force a new line and only takes up the necessary space for its content. <B> (Bold): Text Level (Inline) Tag Justification: It applies a formatting style (bold) to text within a line. It does not force a new line and flows with the surrounding text content. <H2> (Heading Level 2): Block Level Tag Justification: Headings are designed to structure content into distinct blocks. An <h2> always starts on a new line and has default top and bottom margins, separating it from adjacent content. <HR> (Horizontal Rule): Block Level Tag Justification: It creates a horizontal line across the page, which is a visual block element. It always starts on a new line and acts as a divider, pushing subsequent content to the next line. Suppose you have created a webpage using HTML. To do so you use a Text Editor and Microsoft Edge. How does the role of the Text Editor differ from that of the Microsoft Edge in this process? The roles of a Text Editor and Microsoft Edge are distinct and complementary in web page creation: Role of the Text Editor (e.g., Notepad, VS Code): Creation/Writing: The text editor is where you write and compose the HTML code. It acts as your workspace for typing tags, attributes, and content. Editing: It allows you to modify, update, or correct the underlying HTML code of your web page. Saving: It is used to save your code as an .html (or .htm) file, storing the instructions for the web browser. No Rendering: A text editor does not interpret or display the web page visually; it only shows the raw code. Role of Microsoft Edge (Web Browser): Interpretation/Rendering: Microsoft Edge’s primary role is to interpret the HTML code (and any linked CSS/JavaScript) and render or display the web page visually according to those instructions. Viewing: It allows you to view how your HTML code translates into a functional web page, showing the actual layout, text formatting, images, and links. Testing/Debugging: It acts as a testing environment to see if your code works as intended and to identify any display issues. No Editing: A web browser like Edge does not allow you to directly edit the underlying HTML code of a local file; it only displays the rendered output. In essence, the Text Editor is for writing and manipulating the blueprint (the code), while the Web Browser (Microsoft Edge) is for reading and displaying the finished product (the web page) based on that blueprint. Crack The Code
Down:
This CSS property sets the border of an element This attribute in CSS is used to define the style of an HTML element This CSS property is used to change text color This tag defines the body of the HTML document The language used to create web pages Across:
This CSS property is used for text alignment TEXTALIGN (This would fit better as TEXT-ALIGN in actual CSS, but for a crossword, TEXTALIGN is likely the intended word based on the length) This CSS property is used to set the background color BACKGROUNDCOLOR (Similarly, BACKGROUND-COLOR in CSS, but for crossword: BACKGROUNDCOLOR) This CSS property sets the width of an element Solved Crossword:
Across:
3. TEXTALIGN
5. BACKGROUNDCOLOR**
6. WIDTH