教程
89个主题在此版面
-
HTML Code Challenges Test your HTML skills with code challenges from all categories: Code Challenges Loading challenges...
-
- 0 篇回复
- 19 次查看
-
-
HTML Exercises Test your HTML skills with exercises from all categories: Exercises Tip: Sign in to track your progress. 0/51 done Introduction3 exercisesOpenDoneBasic4 exercisesOpenDoneElements3 exercisesOpenDoneAttributes5 exercisesOpenDoneHeadings3 exercisesOpenDoneParagraphs6 exercisesOpenDoneStyles7 exercisesOpenDoneFormatting6 exercisesOpenDoneQuotations5 exercisesOpenDoneComments3 exercisesOpenDoneColors3 exercisesOpenDoneRGB Colors3 exercisesOpenDoneHex Colors3 exercisesOpenDoneHSL Colors3 exercisesOpenDoneCSS5 exercisesOpenDoneLinks5 exercisesOpenDoneLink Colors3 exercisesOpenDoneBookmarks3 exercisesOpenDoneImages7 exercisesOpenDoneImage Map3 exer…
-
- 0 篇回复
- 27 次查看
-
-
HTML Quiz You can test your HTML skills with W3Schools' Quiz. The Test The test contains 40 questions and there is no time limit. The test is not official, it's just a nice way to see how much you know, or don't know, about HTML. Count Your Score You will get 1 point for each correct answer. At the end of the Quiz, your total score will be displayed. Maximum score is 40 points. Start the Quiz Good luck! Start the HTML Quiz ❯ If you don't know HTML, we suggest that you read our HTML Tutorial from scratch. Kickstart your career Get certified by completing the course
-
- 0 篇回复
- 23 次查看
-
-
HTML Online Editor HTML Editor With our online HTML editor, you can edit HTML, CSS and JavaScript code, and view the result in your browser. Run » Size: Example <!DOCTYPE html> <html> <title>HTML Tutorial</title> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html> This is a Heading This is a paragraph. Try it Yourself » Click on the "Try it Yourself" button to see how it works. Publish Your Code If you want to save your HTML, CSS and JavaScript code, and create your own website, check out W3Schools Spaces. W3Schools Spaces …
-
- 0 篇回复
- 24 次查看
-
-
HTML Examples HTML Basic HTML document HTML headings HTML paragraphs HTML links HTML images HTML buttons HTML lists Examples explained HTML Attributes The title attribute The href attribute The width and height attributes The alt attribute Attribute without quotes Attribute without quotes does not work Examples explained HTML Headings HTML headings HTML horizontal rules HTML head Examples explained HTML Paragraphs HTML paragraphs More HTML paragraphs The use of line breaks in HTML Poem problems (some problems with HTML formatting) How to control the line breaks and spaces with the <pre> tag Examples explained HTML Styles HTML styles HTML back…
-
- 0 篇回复
- 26 次查看
-
-
HTML Server-Sent Events API The Server-Sent Events (SSE) API enables pushing messages/updates from a server to the web page via HTTP connection. Server-Sent Events - One Way Messaging A server-sent event is when a web page automatically gets messages/updates from a server. Normally, a web page has to request data from the server, but with server-sent events, the updates are pushed automatically. Examples: Facebook/Twitter updates, stock market updates, news feeds, sport results, etc. Browser Support The numbers in the table specify the first browser version that fully support the Server-Sent Events API. API …
-
- 0 篇回复
- 24 次查看
-
-
HTML Web Workers API A web worker is an external JavaScript file that runs in the background, without affecting the performance of the page. What is a Web Worker? When executing scripts in an HTML page, the page becomes unresponsive until the script is finished. A web worker is an external JavaScript file that runs in the background, independently of other scripts, without affecting the performance of the page. You can continue to do whatever you want: clicking, selecting things, etc., while the web worker runs in the background. Web workers are useful for heavy code that can't be run on the main thread, without causing long tasks that make the page unresponsi…
-
- 0 篇回复
- 26 次查看
-
-
HTML Web Storage API HTML Web Storage API; better than cookies. What is HTML Web Storage? With web storage, applications can store data locally within the user's browser. Before HTML5, application data had to be stored in cookies, included in every server request. Web storage is more secure, and large amounts of data can be stored locally, without affecting website performance. Unlike cookies, the storage limit is far larger (at least 5MB) and information is never transferred to the server. Web storage is per origin (per domain and protocol). All pages, from one origin, can store and access the same data. Web Storage API Objects Web storage provides two obj…
-
- 0 篇回复
- 28 次查看
-
-
HTML Drag and Drop API The HTML Drag and Drop API enables an element to be dragged and dropped. Example Drag the W3Schools image into the second rectangle. Drag and Drop Drag and drop is a very common feature. It is when you "grab" an object and drag it to a different location. Browser Support The numbers in the table specify the first browser version that fully supports Drag and Drop. API Drag and Drop 4.0 9.0 3.5 6.0 12.0 HTML Drag and Drop API Example The example below is a simple drag and drop example: Example <!DOCTYPE HTML> <html> <head>…
-
- 0 篇回复
- 21 次查看
-
-
HTML Geolocation API The Geolocation API is used to get the user's current location. Locate the User's Position The Geolocation API is used to access the user's current location. Since this can compromise privacy, the location is not available unless the user approves it. Note: The Geolocation API is only available on secure contexts such as HTTPS. Tip: The Geolocation API is most accurate for devices with GPS, like smartphones or smartwatches. Browser Support The numbers in the table specify the first browser version that fully supports Geolocation. API Geolocation 5.0 12.0 3.5 …
-
- 0 篇回复
- 23 次查看
-
-
HTML - What is a Web API? A Web API is a developer's dream. It can extend the functionality of the browser It can greatly simplify complex functions It can provide easy syntax to complex code What is Web API? API stands for Application Programming Interface. An API is some kind of interface that includes a set of functions and subroutines that allow programmers to access specific features or data of an application, operating system or other services. A Web API is an application programming interface for the Web. HTML APIs All browsers have a set of built-in Web APIs to support complex operations, and to help accessing data. Here are some of the main HT…
-
- 0 篇回复
- 24 次查看
-
-
HTML YouTube Videos The easiest way to play videos in HTML, is to use YouTube. Struggling with Video Formats? Converting videos to different formats can be difficult and time-consuming. An easier solution is to let YouTube play the videos in your web page. YouTube Video Id YouTube will display an id (like tgbNymZ7vqY), when you save (or play) a video. You can use this id, and refer to your video in the HTML code. Playing a YouTube Video in HTML To play your video on a web page, do the following: Upload the video to YouTube Take a note of the video id Define an <iframe> element in your web page Let the src attribute point to the video URL Use th…
-
- 0 篇回复
- 26 次查看
-
-
HTML Plug-ins Plug-ins are computer programs that extend the standard functionality of the browser. Plug-ins Plug-ins were designed to be used for many different purposes: To run Java applets To run Microsoft ActiveX controls To display Flash movies To display maps To scan for viruses To verify a bank id Warning ! Most browsers no longer support Java Applets and Plug-ins. ActiveX controls are no longer supported in any browsers. The support for Shockwave Flash has also been turned off in modern browsers. The <object> Element The <object> element is supported by all browsers. The <object> element defines an embedded object within an HT…
-
- 0 篇回复
- 29 次查看
-
-
HTML Audio The HTML <audio> element is used to play an audio file on a web page. The HTML <audio> Element To play an audio file in HTML, use the <audio> element: Example <audio controls> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio> HTML Audio - How It Works The controls attribute adds audio controls, like play, pause, and volume. The <source> element allows you to specify alternative audio files which the browser may choose from. The browser will use the first recognized format. The text between th…
-
- 0 篇回复
- 29 次查看
-
-
HTML Video The HTML <video> element is used to show a video on a web page. Video Example Courtesy of Big Buck Bunny: Your browser does not support HTML5 video. The HTML <video> Element To show a video in HTML, use the <video> element: Example <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video> How it Works The controls attribute adds video controls, like play, pause, and volume. It is a good idea to always include width and height attributes. If he…
-
- 0 篇回复
- 27 次查看
-
-
HTML Multimedia Multimedia on the web is sound, music, videos, movies, and animations. What is Multimedia? Multimedia comes in many different formats. It can be almost anything you can hear or see, like images, music, sound, videos, records, films, animations, and more. Web pages often contain multimedia elements of different types and formats. Browser Support The first web browsers had support for text only, limited to a single font in a single color. Later came browsers with support for colors, fonts, images, and multimedia! Multimedia Formats Multimedia elements (like audio or video) are stored in media files. The most common way to discover the type…
-
- 0 篇回复
- 21 次查看
-
-
HTML SVG Graphics SVG (Scalable Vector Graphics) SVG defines vector-based graphics in XML, which can be directly embedded in HTML pages. SVG graphics are scalable, and do not lose any quality if they are zoomed or resized: SVG is supported by all major browsers. What is SVG? SVG stands for Scalable Vector Graphics SVG is used to define vector-based graphics for the Web SVG defines graphics in XML format Each element and attribute in SVG files can be animated SVG is a W3C recommendation SVG integrates with other standards, such as CSS, DOM, XSL and JavaScript The <svg> Element The HTML <svg> element is a container for SVG graphics. …
-
- 0 篇回复
- 20 次查看
-
-
HTML Canvas Graphics Your browser does not support the <canvas> element. The HTML <canvas> element is used to draw graphics on a web page. The graphic to the left is created with <canvas>. It shows four elements: a red rectangle, a gradient rectangle, a multicolor rectangle, and a multicolor text. What is HTML Canvas? The HTML <canvas> element is used to draw graphics, on the fly, via JavaScript. The <canvas> element is only a container for graphics. You must use JavaScript to actually draw the graphics. Canvas has several methods for drawing paths, boxes, circles, text, and adding images. Canvas is supported by all major b…
-
- 0 篇回复
- 21 次查看
-
-
HTML Input form* Attributes This chapter describes the different form* attributes for the HTML <input> element. The form Attribute The input form attribute specifies the form the <input> element belongs to. The value of this attribute must be equal to the id attribute of the <form> element it belongs to. Example An input field located outside of the HTML form (but still a part of the form): <form action="/action_page.php" id="form1"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <input type="submit" value="Submit"> </form> &l…
-
- 0 篇回复
- 18 次查看
-
-
HTML Input Attributes This chapter describes the different attributes for the HTML <input> element. The value Attribute The input value attribute specifies an initial value for an input field: Example Input fields with initial (default) values: <form> <label for="fname">First name:</label><br> <input type="text" id="fname" name="fname" value="John"><br> <label for="lname">Last name:</label><br> <input type="text" id="lname" name="lname" value="Doe"> </form> The readonly Attribute The input readonly attribute specifies that an input field is read-only. A read-only …
-
- 0 篇回复
- 22 次查看
-
-
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 篇回复
- 20 次查看
-
-
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 篇回复
- 23 次查看
-
-
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 次查看
-
