Mobile web implements responsive layout (rem)
rem unit:
rem (root em) is a relative unit, similar to em, which is the font size of the parent element. The difference is that the benchmark of rem is the font size relative to html elements.
For example, if the root element (html) is set to font size = 12px and the non root element is set to width: 2rem, it will be converted to PX, which ...
Posted by rodneykm on Fri, 31 Dec 2021 23:19:12 +0100
Java Web css (selector, page positioning, row elements, block elements, conversion between block elements within rows, layer floating, table layout page, div and css layout page)
1. Line label and block label
Line label: by default, a label that does not occupy a whole line will occupy as much width as the content is Block label: This is the label that occupies one line by default. h1 # hr # ul li In line block label: it has the characteristics of some line labels and block labels
<!DOCTYPE html>
<html&g ...
Posted by TylerL on Fri, 31 Dec 2021 05:49:14 +0100
JS expressions and operators
Reprinted from: https://jerry-z-j-r.github.io/2021/08/06/JS-Cheat-Sheet-3/ (from JERRY)
1, JS expressions and operators
Expression: an expression consisting of operands and operators.
Classification of expressions: arithmetic, relation, logic, assignment and synthesis.
2, Arithmetic expression
2.1 arithmetic operators
significanceop ...
Posted by lepass_7 on Thu, 30 Dec 2021 19:48:33 +0100
Day07_CSS class notes
Day07 CSS class notes
1 Review
1. CSS Styles: background
background-color
background-image
background-repeat
background-position / background-position-x / background-position-y
background-attachment
background
2. CSS Styles: mouse cursor styles
cursor: pointer / move
3. CSS Styles: list properties
list-style-type
...
Posted by asd on Wed, 29 Dec 2021 06:06:36 +0100
CSS3 transform
@
1. Introduction
Transform: it is one of the features of CSS3. It can realize the effects of element displacement, rotation, scaling and so on. It can be understood as "deformation".
Moving: translate
Rotation: rotate
Scaling: scale
2. 2D conversion
1.) two dimensional plane coordinate system
2D conversion is a technology to ...
Posted by vijay17877 on Tue, 28 Dec 2021 12:30:54 +0100
Day13 - DOM operation of JavaScript, several widths and heights of the page, return to the top and bottom, and operation knowledge related to labels
1, DOM Foundation
DOM: document object model, which is used to manipulate page labels and css DOM is actually part of BOM
Basic operations of DOM:
console.log(document) ; //Print entire page
console.log(document.documentElement) ; //Print html
console.log(document.body) ; //Print body content
console.log(document.head) ; //Pr ...
Posted by MidOhioIT on Tue, 28 Dec 2021 03:19:58 +0100
Front end: CSS Basics
CSS Basics
1: What is CSS
Cascading style sheets (English full name: Cascading Style Sheets) is a computer language used to represent file styles such as HTML (an application of Standard General Markup Language) or XML (a subset of Standard General Markup Language). CSS can not only modify web pages statically, but also format each el ...
Posted by Plagel on Mon, 27 Dec 2021 18:24:01 +0100
css coupon and card coupon style drawing (with shadow and sawtooth)
Recently, I was working on a small program project like a mall. Cards and vouchers are indispensable for the mall. At first, I planned to cut the UI, but I found it not so convenient, so I made a fuss by referring to various materials. Without much nonsense, I went to the renderings first: It can be seen from the effect drawing that the coupon ...
Posted by Desdinova on Mon, 27 Dec 2021 14:09:43 +0100
Tailwind CSS introduction that can be understood at one time
This article is for beginners who have never used Taliwind CSS. We will explain the basic settings and customization methods by building the Tailwind CSS environment, so as to understand the increasingly popular CSS framework of Tailwind CSS.The current usage of Taliwind CSS is that the number of users is increasing and new functions are being ...
Posted by broheem on Mon, 27 Dec 2021 12:32:35 +0100
JavaScript WebGL draws a face
IntroductionJavaScript WebGL Basics After some optimization, we try to draw common two-dimensional faces.The geometry in WebGL is ultimately composed of triangles, which is more suitable for cutting in.OriginMy GitHubDraw triangleThis is Example , based on Draw a line The main changes are:vertexDrawing elementsvertexA triangle has three vertice ...
Posted by LinuxForce on Sun, 26 Dec 2021 06:02:06 +0100