Category:HTML5

  • HTML5 preview local pictures

    Time:2021-10-22

    Problem descriptionSuppose we have a picture upload control in HTML: Copy code The code is as follows: <input type=”file” name=”image” accept=”image/*” /> Note that this accept = “image / *” is very important. It specifies that the uploaded image will be related to the pop-up window selection type of the system at the mobile terminal. […]

  • Simply sort out the basic features and syntax of HTML5

    Time:2021-10-21

    HTML5 overviewHTML5 is the next important version of HTML standard, which is used to replace HTML 4.01, XHTML 1.0 and XHTML 1.1. HTML5 is also a standard for building and presenting content on the world wide web. HTML5 is a collaboration between the World Wide Web Consortium (W3C) and the web Hypertext Technology Working Group […]

  • Comprehensive analysis of standard attributes and custom attributes in HTML5

    Time:2021-10-20

    As explained in the HTML5 syntax, an element can contain attributes and set various properties for an element. Some attributes are defined as global and can be used on any element, while others are defined as element specific. All properties have a name and a value, which looks like the following example. The following is […]

  • HTML5 digital input accepts only integer implementation code

    Time:2021-10-19

    I have seen many articles and posts about this in the past two years, which is really a very convenient thing. However, too many implementations still have loopholes, incomplete implementations, and so on. The overall concept is reasonable: use HTML 5 attributes to limit the content that can be sent to the server, and then […]

  • HTML + CSS to realize the special effects of image scanner

    Time:2021-10-18

    This article mainly introduces the HTML CSS image scanner and shares it with you as follows: effect: In this way, there are jitters: Jitter free: realization: 1. Define a box: <body> <div class=”tu”></div> </body> 2. Basic style, length and width background drawing, etc~ .tu{ width: 500px; height: 300px; background-image: url(8.jpg); background-size: 100% auto; background-repeat: no-repeat; […]

  • HTML5 implementation of drag and drop mobile floating icon example code

    Time:2021-10-17

    There are often such requirements on H5: You need to add a floating icon on the page, which is roughly the final implementation as shown in the figure below But often according to the design draft, it will not cover the main area, but in fact, sometimes it will cover the main area, but in […]

  • Sample code of how to share screenshots in front-end HTML5

    Time:2021-10-16

    preface This article mainly introduces how to share screenshots using canvas,At first, I thought it was not difficult to share pictures through canvas painting, but in fact, I still encountered a lot of holes during developmentFor example:① The background of the picture is transparent② Share pictures only text, no pictures③ Picture cross domain problemHere is […]

  • Use canvas to achieve snowflake floating effect example code

    Time:2021-10-15

    Today we use canvas to achieve the effect of snowflakes falling ❄️ 1、 What is canvas? HTML5 < canvas > elements are used for drawing graphics and are completed by scripts (usually JavaScript) The < canvas > tag is just a graphics container, and you must use a script to draw graphics. You can use […]

  • Using HTML + CSS to realize the slow drop-down effect of menu bar

    Time:2021-10-14

    Objective: use HTML + CSS to realize the effect that the menu bar will appear slowly when the mouse moves to the menu bar We can solve this problem in two ways Method 1: Transition Turn on forum-1Absolute positioning(absolute), let the insideliBreak away from its parent element, otherwise it will squeeze the subsequent content to […]

  • Play m4a audio file on HTML5 page

    Time:2021-10-13

    Business scenario: The recording is recorded on the app side of the mobile phone, and then uploaded to the background server. The front end obtains the recording from the background server and plays it on the web page of the PC side. Practical problems: First of all, the app recording file defaults to m4a format. […]

  • Sample code of 3D navigation bar using HTML + CSS + transform

    Time:2021-10-12

    3D is the abbreviation of three-dimensional, which is three-dimensional graphics. Display 3D graphics in the computer, that is, display 3D graphics in the plane. Unlike the real world, the real three-dimensional space has a real distance space. The computer just looks like the real world, so the 3D graphics displayed on the computer look like […]

  • Implementation example of adding watermark mask layer to native HTML

    Time:2021-10-11

    design sketch code <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta http-equiv=”X-UA-Compatible” content=”IE=edge”> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> < title > watermark mask < / Title > </head> <style> .watermark_mask { position: fixed; top: 10px; } .hello { width: 500px; height: 2048px; margin: 0 auto; background-color: pink; } </style> <body> <div class=”hello”> Hello World <div style=”margin-top: […]