Tag：DIV
-
Time：2021-5-14
1. First of all, we need to use the target selector of CSS3 to switch the target element with the ID selector specified by a tag, which is used to select the target element of the current activity.2. Transition animation of CSS3. I won’t introduce it in detail here Take a look at the renderings: […]
-
Time：2021-5-2
1、 Requirement description The delete icon is displayed in the upper right corner of the div tab 2、 Implementation mode html、CSS 3、 Reference code <style> .container{ width:60px; height:60px; border: 1px dotted red; position:relative; } .content{ position:relative; top:20px; } .delete{ width:20px; height:20px; border-radius:60%; position:absolute; top:-10px; right:-10px; } </style> <div class=”container”> <img src=”http://www.iconpng.com/download/png/61252″ class=”delete” οnclick=”alert(1)”/> <div class=”content”>content</div> […]
-
Time：2021-4-27
There are only two steps to add background control to a component <View className=”gifts” style={{ background: `url(${baseUrl}starMove/exclusiveEntrance/card.png) no-repeat`, backgroundSize: ‘100% 100%’, }} > <View classname=”gift-lists”></View> </View> Set background and backgroundsize. style={ width：100%； height：100%； } PS: now let’s introduce how the CSS file can make the size of the background image adapt to the size of […]
-
Time：2021-2-25
This paper analyzes the layout of HTML5 div and table for your reference Div layout:HTML + CSS to achieve simple layout. #Height in container cannot be written as a percentage. It must be a specific height. <!DOCTYPE html> <html> <head lang=”en”> <meta charset=”UTF-8″> < title > div layout <style type=”text/css”> body{ margin:0; padding:0; } #container{ […]
-
Time：2021-2-9
Option 1: Html： <div class=”outer”> < div class = “a” > head div < / div > < div class = “B” > lower div < / div > </div> CSS： html, body { height: 100%; padding: 0; margin: 0; } .outer { height: 100%; padding: 100px 0 0; box-sizing: border-box ; position: relative; } […]
-
Time：2021-2-2
preface Sometimes you need to keep the height of a box container 100% at all times, and the browser height remains the same no matter how you zoom. It’s like the sidebar of some websites, but it doesn’t work to set the height of the box container to 100%. demo If you want the percentage […]
-
Time：2021-1-24
In today’s responsive layout requirements, many elements that can automatically adjust the size can achieve height and width adaptation, such as img{ width:50%;height : Auto;} to adjust the height of the picture according to the width ratio. However, div, the most used tag, can’t be adjusted automatically (either inherited from the parent, or specified Px, […]
-
Time：2021-1-5
The specific codes are as follows: The HTML code looks like this <div class=”arrow-up”> <! — upward Triangle — > </div> <div class=”arrow-down”> <! — downward Triangle — > </div> <div class=”arrow-left”> <! — left triangle — > </div> <div class=”arrow-right”> <! — triangle to the right — > </div> Next, CSS3 is used to […]
-
Time：2021-1-3
1. Flex is the abbreviation of flexible box, which means “flexible layout”, and is used to provide the maximum flexibility for the box model. Any container can be specified as a flex layout. Note that when set to flex layout, the float, clear, and vertical align properties of the child elements will be invalid. Elements […]
-
Time：2020-12-10
Recently, I’m doing a comment function. I need to be able to comment on the expressioncontentEditableThis attribute is the first to bear the brunt of the problem First of all, I would like to comment on the district chief When the input content exceeds the limit, clear the user’s input content beyond the limit. […]
-
Time：2020-11-29
1、 Property list Copy code The code is as follows: Color: text colorFont family: Song typefaceFont size: 10pt text sizefont- style:itelic Character slanting Sportsfont- variant:small-caps Small fontLetter spacing: 1pt text spacingLine height: 200% set line heightfont- weight:bold Text in boldvertical- align:sub Subscriptvertical- align:super superscript text-d ecoration:line-through Add? H to remove the wiretext-d ecoration:overline Top linetext-d […]
-
Time：2020-11-9
Method 1 float:rightIn addition, floating makes the layout more compact (no gaps) <div style=”background-color: red;width: 100%;height: 60px;/* text-align: right; */”> <div style=”width: 30px;height: 100%;background-color: yellow;float: right;”>hello</div> <div style=”width: 60px;height: 100%;background-color: blue;float: right;”>hi</div> </div> The effect picture is as follows: Method 2 display:inline-block+text-align:righttext- align:right The influence is the in line element or text under it, so […]
