• Building single page application based on vue.js and WordPress rest API


    Preface Vue.js is a library for building interactive web interfaces. It provides MVVM data binding and a composable component system with simple and flexible API.Axios is an HTTP client based on promise for browsers and nodejs, which we will use to request APIs.WordPress rest API provides an API endpoint for WordPress data type, allowing developers […]

  • A detailed explanation of the problems in the combination of CSS ellipsis and padding


    Text truncation implemented by CSS Consider the following code to realize the style code of text exceeding automatic truncation: .truncate-text-4 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; } Test with the following HTML fragment: <style> .my-div { width: 300px; margin: 10px auto; background: #ddd; } </style> <div class=”my-div truncate-text-4″> How Not […]

  • The use of cross env in Vue


    cross-env Cross-env is a cross platform script for setting and using environment variables. In most windows command lines, an error is reported when using node? Env = production to set environment variables. Similarly, how windows and Linux commands set environment variables is different.Usecross-envYou can set the same node? Env parameter on different platforms. Use install […]

  • Front end interview 3 + 1-149 days a day


    Today’s knowledge (September 12, 2019) – day 149 [HTML] how to set the content of the entire page to read-only, non editable state? [CSS] what’s the difference between responsive design and adaptive design? [JS] using JS to realize the encryption and decryption of Morse password [soft skills] tell me about your understanding of vector map […]

  • CSS implementation of Google material design text input box style (recommended)


    Hello everyone, today I want to share with you how to use pure CSS to realize the style of Google material design text input box. Although we have many frameworks today that can help us implement these styles, we can enhance our ability to customize these framework components according to business needs in the future […]

  • Appreciation of some “scrolling” behaviors of browser Chinese style


    I’ve been very busy recently. I’m free to write this timeEdify the sentiment,Browser scrollingI really see you every day. For example, if you read this article now, you have to scroll down. This article mainly talks aboutRolling correlationSome ofMethodFollowattributeThere are some interesting examples A kind of The article involvesMethod or propertyLink will be placed at […]

  • Making 3D photo wall effect with CSS


    Use CSS to make 3D photo wall, the specific code is as follows: <!doctype html> <html> <head> <meta charset=”utf-8″> < title > Untitled Document < / Title > </head> <body> <div> <img src=”#”/> <img src=”#”/> <img src=”#”/> <img src=”#”/> <img src=”#”/> <img src=”#”/> <img src=”#”/> <img src=”#”/> </div> </body> </html>   The above code is […]

  • The development of IOS on mobile terminal includes WebView


    1 solve IOS rubber band effect ul { Height: 115px; // be sure to set the height, or max height: XXXX; border: 1px solid gray; overflow: auto; -WebKit overflow scrolling: touch; // no jamming when sliding } </style> <ul> <li>List Item 1</li> <li>List Item 2</li> <li>List Item 3</li> <li>List Item 4</li> <li>List Item 5</li> <li>List […]

  • CSS shadow animation optimization techniques


    How to animate box shadow with silky smooth performance This article is not literal translation, because I think this technique is very interesting and useful, so I started a paper. box-shaodwIn our work and more and more, with the shadow of the animation more or less have a little. Suppose we have a box like […]

  • How to clear the default style and set the common style in CSS


    CSS clear default style General clear default style: *{ margin:0; padding:0 } li{ list-style:none } img{ vertical-align:top; border:none } Set default font body, button, input, select, textarea /* for ie */ { font: 14px/1.5 tahoma, \5b8b\4f53, sans-serif; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal;} Address, cite, DFN, EM, VAR {font […]

  • Front end interview 3 + 1 Daily – the 150th day


    Today’s knowledge (September 13, 2019) – day 150 [HTML] how does HTML 5 make a page element or an entire page editable? #128 [CSS] tell me when to use transition? When to use animation? [JS] Why is js a single thread, not a multi thread? [soft skills] tell me about your understanding of heap and […]

  • The method of adding color mask to background picture in CSS3


    Some time ago, in the development process, we met with projects that need to add color mask to the background layer. Now we will specifically summarize the method of adding color mask to the background layer. Method 1: stack by positioning (attention level) <div class=”wrap1″> <div class=”inner”> </div> </div> .wrap1 { position: relative; width: 1200px; […]