{padding: 0 5rpx; height: 70rpx; font-size: 25rpx; } width: 150px; overflow: hidden; text-overflow: ellipsis; */ display: -webkit-box; /* Limit the number of lines of text displayed in a block element */ -webkit-line-clamp: 3; /* Sets or retrieves the arrangement of the children of the flex box object */ -webkit-box-orient: vertical; } single line {width: 150px; /* White-space: normal; / /* white-space: normal; */ /* 1. This word means that if the text is not open, it must force a line to display */ white-space: nowrap; /* overflow: hidden; /* overflow: ellipsis; /* overflow: ellipsis; } // Cancel the scrollbar ::-webkit-scrollbar {width: 0; height: 0; color: transparent; } // Modify the browser scrollbar style ::-webkit-scrollbar {width: 4px; // background-color: #999999; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: #999999; } ::-webkit-scrollbar-track { background: #303642; Background - the size of the basic syntax: use background - size: length | percentage with | cover | contain; Length Sets the width and height of the background image. The first value is the width and the second value is the height. If only the first value is set, the second value is automatically converted to "auto"; Percentage Sets the width and height of the image using the percentage of the parent element. The first value is the width and the second value is the height. If only one value is set, the second value is set to "auto"; Cover Extends the background image to a size large enough to completely cover the background area. Expand the image to the maximum size so that the width and height fully fit the content area. [click here] (https://www.cnblogs.com/tugenhua0707/p/5260411.html) background - use the background - the position of the position: Xpos ypos | x % % y | x y CSS1, background - position attribute requires two parameters, the first value is used for horizontal axis, the second value is used in the vertical, the default value is 0% 0%, namely the background image to the top-left corner of the object background region aligned on the upper left corner. If only one value is provided, it is used for the X-axis, and the Y-axis uses the default value center, which is vertically centered. The above syntax format indicates that the background image has three kinds of positioning methods: 1) xpos ypos: said using predefined keyword positioning, horizontal optional keywords have left | center | right, optional keyword vertical direction are top | center | bottom. Keyword positioning applies alignment rules, not coordinate rules. Xpos for left means the left of the image is aligned with the left of the object, and xpos for right means the right of the image is aligned with the right of the object; Ypos for top means the top of the image is aligned with the top of the object, and bottom means the bottom of the image is aligned with the bottom of the object; Xpos and ypos equal to center indicate the center of the image in the horizontal and vertical directions, and the center alignment of the object in the horizontal and vertical directions, i.e. GIF is 100px by 100px, the object is 200px by 200px, and the background image is positioned using predefined keywords. For example: 2) x% y% : indicates the use of percentage positioning, is the image itself (x%, y%) that point, and the background area (x%, y%) that point overlap. Finally, the calculation formula of the initial position coordinate of the background image is: x = (the width of the object - the width of the image) * x%; Y = (height of object - height of image) * y%; 3) x y: refers to positioning with length value. It is to place the upper left corner of the background image at the position specified by (x, y) in the background area of the object, that is, x and y define the upper left corner of the background image relative to the offset of the upper left corner of the background area. The offset length can be positive or negative. A positive value of x indicates a shift to the right and a negative value indicates a shift to the left. A positive value of y indicates a downward offset, and a negative value indicates an upward offset. When the background image is moved, it is possible to go beyond the background area of the object. At this point, the exceeded portion will not be displayed, and only the portion that falls into the background area will be displayed. If the above example is changed to length positioning, to center the background image, simply set the background image to 50px 50px. It represents the upper-left vertex of the background image, moving 50px to the right and 50px down the Y-axis relative to the upper-left vertex of the object's background area. The result is still the background image in the center of the object. 4) In CSS3, the background-position attribute supports four parameter values, the first two values for abscissa and the last two values for ordinate. This means we can position ourselves relative to the top, left, bottom, and right corners, rather than the top left corner. You can specify the starting position of the background image with a length value, or a percentage. If only one value is provided, the second value is center. If two values are provided, the first length or percentage represents the horizontal offset and the second length or percentage represents the vertical offset. The offset of the upper-left corner of the background image relative to the upper-left corner of the background position region. For example, the following statements give the offset of the starting point of the background relative to the upper left corner of the background area: background-position: left 10px top 15px; /* 10px, 15px */ background-position: left top ; /* 0px, 0px */ background-position: 10px 15px; /* 10px, 15px */ background-position: left 15px; /* 0px, 15px */ background-position: 10px top ; /* 10px, 0px */ background-position: left top 15px; /* 0px, 15px */ background-position: left 10px top ; / * 10 px, 0 px * / [click here] (https://blog.csdn.net/ixygj197875/article/details/79333151) / / if it is a mobile phone to open, Function isPc(){ if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fen Nec | wOSBrowser | BrowserNG | WebOS | Symbian | Windows Phone)/I))) {/ * window. The location. Href = "" mobile version of your address; */} else {/*window.location.href=" your computer version address "; */}} // {backTop () {/ / implementation effect of rolling const timeTop = setInterval (() = > {let top = document. DocumentElement. ScrollTop | | document.body.scrollTop; document.body.scrollTop = document.documentElement.scrollTop = top -= 50; if (top <= 0) { clearInterval(timeTop); }}, 10); // Mounted () {window.addeventListener ("scroll", () => { if ( document.documentElement.scrollTop >= 500 || document.body.scrollTop >= 500 ) { this.navAddClass = true; } else { this.navAddClass = false; }}); }, vscode column edit: Alt +shift+ hubilderx Alt + left mouse button quickly generate @param comment save the function first, then write /**+enter in the function header. Zoom in with CTRL + Shift + +, zoom out with CTRL + Shift + -, and it works pretty well. Swiper CDN < script SRC = "https://cdn.bootcss.com/Swiper/3.4.2/js/swiper.min.js" > < \ / script > @ import The url (" https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css "); Small program ID: wXF38D299033C6D34CCopy the code