HTML Application Skills (6)

2022-05-02 0 By

1. What are the common attributes of box-sizing?The box-sizing property defines how to calculate the total width and height of an element, and whether or not you need padding and borders.For example, if you need to place two framed boxes side by side, you can set box-sizing to “border-box”.This allows the browser to render a box with a specified width and height, and to put borders and margins inside the box.By default, element width and height are calculated as follows: box-sizing:content-boxThe default value.If you set the width of an element to 100px, the content area of the element will be 100px wide, and the width of any borders and margins will be added to the width of the final drawn element.2) box – sizing: border – box.Tell the browser that the border and margin values you want to set are contained within width.That is, if you set the width of an element to 100px, then the 100px will contain the border and padding. The actual width of the content area is the border minus the padding value.In most cases, this makes it easier to set the width and height of an element.Note: border-box does not include margin.2. Image blur processing: main syntax format: filter: blur (fuzzy values).The greater the value, the greater the ambiguity.3.CSS calc() function.1) Use “+”, “-“, “*” and “/”. 2) Use Spaces before and after “+” and “-“. For example, “widht: calc(12%+5em)” is not written with Spaces