教程
89个主题在此版面
-
HTML Page Title Every web page should have a page title to describe the meaning of the page. The Title Element The <title> element adds a title to your page: Example <!DOCTYPE html> <html> <head> <title>HTML Tutorial</title> </head> <body> The content of the document...... </body> </html> The title is shown in the browser's title bar: What is a Good Title? The title should describe the content and the meaning of the page. The page title is very important for search engine optimization (SEO). The text is used by search engine algorithms to decide the order when listing pages i…
-
- 0 篇回复
- 23 次查看
-
-
HTML Favicon A favicon is a small image displayed next to the page title in the browser tab. How To Add a Favicon in HTML You can use any image you like as your favicon. You can also create your own favicon on sites like https://www.favicon.cc. Tip: A favicon is a small image, so it should be a simple image with high contrast. A favicon image is displayed to the left of the page title in the browser tab, like this: To add a favicon to your website, either save your favicon image to the root directory of your webserver, or create a folder in the root directory called images, and save your favicon image in this folder. A common name for a favicon image is …
-
- 0 篇回复
- 21 次查看
-
-
HTML Images Images can improve the design and the appearance of a web page. Example <img src="pic_trulli.jpg" alt="Italian Trulli"> Example <img src="img_girl.jpg" alt="Girl in a jacket"> Example <img src="img_chania.jpg" alt="Flowers in Chania"> HTML Images Syntax The HTML <img> tag is used to embed an image in a web page. Images are not technically inserted into a web page; images are linked to web pages. The <img> tag creates a holding space for the referenced image. The <img> tag is empty, it contains attributes only, and does not have a closing tag. The <img> tag has …
-
- 0 篇回复
- 26 次查看
-
-
HTML Links Links are found in nearly all web pages. Links allow users to click their way from page to page. HTML Links - Hyperlinks HTML links are hyperlinks. You can click on a link and jump to another document. When you move the mouse over a link, the mouse arrow will turn into a little hand. Note: A link does not have to be text. A link can be an image or any other HTML element! HTML Links - Syntax The HTML <a> tag defines a hyperlink. It has the following syntax: <a href="url">link text</a> The most important attribute of the <a> element is the href attribute, which indicates the link's destination. The link text is…
-
- 0 篇回复
- 24 次查看
-
-
HTML Styles - CSS CSS stands for Cascading Style Sheets. CSS saves a lot of work. It can control the layout of multiple web pages all at once. CSS = Styles and Colors Manipulate Text Colors, Boxes What is CSS? Cascading Style Sheets (CSS) is used to format the layout of a webpage. With CSS, you can control the color, font, the size of text, the spacing between elements, how elements are positioned and laid out, what background images or background colors are to be used, different displays for different devices and screen sizes, and much more! Tip: The word cascading means that a style applied to a parent element will also apply to all …
-
- 0 篇回复
- 22 次查看
-
-
HTML Colors HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or HSLA values. Color Names In HTML, a color can be specified by using a color name: Tomato Orange DodgerBlue MediumSeaGreen Gray SlateBlue Violet LightGray Try it Yourself » HTML supports 140 standard color names. Background Color You can set the background color for HTML elements: Hello World Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis n…
-
- 0 篇回复
- 19 次查看
-
-
HTML class Attribute The HTML class attribute is used to specify a class for an HTML element. Multiple HTML elements can share the same class. The class Attribute The class attribute is often used to point to a class name in a style sheet. It can also be used by JavaScript to access and manipulate elements with the specific class name. In the following example we have three <div> elements with a class attribute with the value of "city". All of the three <div> elements will be styled equally according to the .city style definition in the head section: Example <!DOCTYPE html> <html> <head> <style> .city { backgroun…
-
- 0 篇回复
- 21 次查看
-
-
HTML Quotation and Citation Elements In this chapter we will go through the <blockquote>,<q>, <abbr>, <address>, <cite>, and <bdo> HTML elements. Example Here is a quote from WWF's website: HTML <blockquote> for Quotations The HTML <blockquote> element defines a section that is quoted from another source. Browsers usually indent <blockquote> elements. Example <p>Here is a quote from WWF's website:</p> <blockquote cite="http://www.worldwildlife.org/who/index.html"> For 60 years, WWF has worked to help people and nature thrive. As the world's leading conservation organizati…
-
- 0 篇回复
- 19 次查看
-
-
HTML Text Formatting HTML contains several elements for defining text with a special meaning. Example This text is bold This text is italic This is subscript and superscript HTML Formatting Elements Formatting elements were designed to display special types of text: <b> - Bold text <strong> - Important text <i> - Italic text <em> - Emphasized text <mark> - Marked text <small> - Smaller text <del> - Deleted text <ins> - Inserted text <sub> - Subscript text <sup> - Superscript text HTML <b> and <strong> Elements The HTML <b> element defines bold text, without any e…
-
- 0 篇回复
- 19 次查看
-
-
HTML Styles The HTML style attribute is used to add styles to an element, such as color, font, size, and more. Example I am Red I am Blue I am Big The HTML Style Attribute Setting the style of an HTML element, can be done with the style attribute. The HTML style attribute has the following syntax: <tagname style="property:value;"> The property is a CSS property. The value is a CSS value. You will learn more about CSS later in this tutorial. Background Color The CSS background-color property defines the background color for an HTML element. Example Set the background color for a page to powderblue: <body style="background-colo…
-
- 0 篇回复
- 20 次查看
-
-
HTML Paragraphs A paragraph always starts on a new line, and is usually a block of text. HTML Paragraphs The HTML <p> element defines a paragraph. A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph. Example <p>This is a paragraph.</p> <p>This is another paragraph.</p> HTML Display You cannot be sure how HTML will be displayed. Large or small screens, and resized windows will create different results. With HTML, you cannot change the display by adding extra spaces or extra lines in your HTML code. The browser will automatically remove any extra sp…
-
- 0 篇回复
- 21 次查看
-
-
HTML Headings HTML headings are titles or subtitles that you want to display on a webpage. Example Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 HTML Headings HTML headings are defined with the <h1> to <h6> tags. <h1> defines the most important heading. <h6> defines the least important heading. Example <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> Note: Browsers automatically add some white space (a margin) before and after a heading. Headings Are Important Search engi…
-
- 0 篇回复
- 24 次查看
-
-
HTML Attributes HTML attributes provide additional information about HTML elements. HTML Attributes All HTML elements can have attributes Attributes provide additional information about elements Attributes are always specified in the start tag Attributes usually come in name/value pairs like: name="value" The href Attribute The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to: Example <a href="https://www.w3schools.com">Visit W3Schools</a> You will learn more about links in our HTML Links chapter. The src Attribute The <img> tag is used to embed an image in an HTML page. T…
-
- 0 篇回复
- 23 次查看
-
-
HTML Elements An HTML element is defined by a start tag, some content, and an end tag. HTML Elements The HTML element is everything from the start tag to the end tag: <tagname>Content goes here...</tagname> Examples of some HTML elements: <h1>My First Heading</h1> <p>My first paragraph.</p> Start tag Element content End tag <h1> My First Heading </h1> <p> My first paragraph. </p> <br> none none Note: Some HTML elements have no content (like the <br> element). These elements are called empty elements. Empty elements do not have an end tag! Nested HTML Elements …
-
- 0 篇回复
- 23 次查看
-
-
HTML Basic Examples In this chapter we will show some basic HTML examples. Don't worry if we use tags you have not learned about yet. HTML Documents All HTML documents must start with a document type declaration: <!DOCTYPE html>. The HTML document itself begins with <html> and ends with </html>. The visible part of the HTML document is between <body> and </body>. Example <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> The <!DOCTYPE> Declaration The <!DOCTYPE> declaration represents the document type, and help…
-
- 0 篇回复
- 23 次查看
-
-
HTML Editors A simple text editor is all you need to learn HTML. Learn HTML Using Notepad or TextEdit Web pages can be created and modified by using professional HTML editors. However, for learning HTML we recommend a simple text editor like Notepad (PC) or TextEdit (Mac). We believe that using a simple text editor is a good way to learn HTML. Follow the steps below to create your first web page with Notepad or TextEdit. Step 1: Open Notepad (PC) Windows 8 or later: Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad. Windows 7 or earlier: Open Start > Programs > Accessories > Notepad Step 1: Open TextEdi…
-
- 0 篇回复
- 22 次查看
-
-
HTML Introduction HTML is the standard markup language for creating Web pages. What is HTML? HTML stands for Hyper Text 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. A Simple HTML Document Example <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>My First Heading</h1> <p>My first …
-
- 0 篇回复
- 22 次查看
-
-
HTML Style Guide Consistent, clean, and tidy HTML code makes it easier for others to read and understand your code. Here are some guidelines and tips for creating good HTML code. Always Declare Document Type Always declare the document type as the first line in your document. The correct document type for HTML is: <!DOCTYPE html> Use Lowercase Element Names HTML allows mixing uppercase and lowercase letters in element names. However, we recommend using lowercase element names, because: Mixing uppercase and lowercase names looks bad Developers normally use lowercase names Lowercase looks cleaner Lowercase is easier to type Good: <body&…
-
- 0 篇回复
- 18 次查看
-
-
HTML Input Types This chapter describes the different types for the HTML <input> element. HTML Input Types Here are the different input types you can use in HTML: <input type="button"> <input type="checkbox"> <input type="color"> <input type="date"> <input type="datetime-local"> <input type="email"> <input type="file"> <input type="hidden"> <input type="image"> <input type="month"> <input type="number"> <input type="password"> <input type="radio"> <input type="range"> <input type="reset"> <input type="search"> <input type="subm…
-
- 0 篇回复
- 21 次查看
-
-
HTML Form Elements This chapter describes all the different HTML form elements. The HTML <form> Elements The HTML <form> element can contain one or more of the following form elements: <input> <label> <select> <textarea> <button> <fieldset> <legend> <datalist> <output> <option> <optgroup> The <input> Element One of the most used form elements is the <input> element. The <input> element can be displayed in several ways, depending on the type attribute. Example <label for="fname">First name:</label> <input type="text" id="…
-
- 0 篇回复
- 24 次查看
-
-
HTML Form Attributes This chapter describes the different attributes for the HTML <form> element. The Action Attribute The action attribute defines the action to be performed when the form is submitted. Usually, the form data is sent to a file on the server when the user clicks on the submit button. In the example below, the form data is sent to a file called "action_page.php". This file contains a server-side script that handles the form data: Example On submit, send form data to "action_page.php": <form action="/action_page.php"> <label for="fname">First name:</label><br> <input type="text" id="fname" name="fname…
-
- 0 篇回复
- 24 次查看
-
-
HTML Forms An HTML form is used to collect user input. The user input is most often sent to a server for processing. Example The <form> Element The HTML <form> element is used to create an HTML form for user input: <form> . form elements . </form> The <form> element is a container for different types of input elements, such as: text fields, checkboxes, radio buttons, submit buttons, etc. All the different form elements are covered in this chapter: HTML Form Elements. The <input> Element The HTML <input> element is the most used form element. An <input> element can be displayed in …
-
- 0 篇回复
- 26 次查看
-
-
HTML Versus XHTML XHTML is a stricter, more XML-based version of HTML. What is XHTML? XHTML stands for EXtensible HyperText Markup Language XHTML is a stricter, more XML-based version of HTML XHTML is HTML defined as an XML application XHTML is supported by all major browsers Why XHTML? XML is a markup language where all documents must be marked up correctly (be "well-formed"). XHTML was developed to make HTML more extensible and flexible to work with other data formats (such as XML). In addition, browsers ignore errors in HTML pages, and try to display the website even if it has some errors in the markup. So XHTML comes with a much stricter error handling.…
-
- 0 篇回复
- 25 次查看
-
-
HTML Uniform Resource Locators A URL is another word for a web address. A URL can be composed of words (e.g. w3schools.com), or an Internet Protocol (IP) address (e.g. 192.68.20.50). Most people enter the name when surfing, because names are easier to remember than numbers. URL - Uniform Resource Locator Web browsers request pages from web servers by using a URL. A Uniform Resource Locator (URL) is used to address a document (or other data) on the web. A web address like https://www.w3schools.com/html/default.asp follows these syntax rules: scheme://prefix.domain:port/path/filename Explanation: scheme - defines the type of Internet service (most common i…
-
- 0 篇回复
- 29 次查看
-
-
HTML Encoding (Character Sets) The HTML charset Attribute To display an HTML page correctly, a web browser must know which character set to use. The character set is specified in the <meta> tag: <meta charset="UTF-8"> The HTML specification encourages web developers to use the UTF-8 character set. UTF-8 covers almost all of the characters and symbols in the world! Learn More: Full UTF-8 Reference The ASCII Character Set ASCII was the first character encoding standard for the web. It defined 128 different latin characters that could be used on the internet: English letters (a-z and A-Z) Numbers (0-9) Some special characters: ! $ + - ( …
-
- 0 篇回复
- 21 次查看
-