it is not possible to use css"s background-image to set a background image for an element in WeChat Mini Programs. So I used
<image src="../../images/img.jpg"></image>
<view>absolute</view>then use top,left,right,bottom to put the content of view on the top level of image. I want to ask if there will be a problem with this method. I can test it on my real machine (only 6s).
there is no problem with testing the real machine in this way, but from the point of view of writing code, it is more suitable to use the background-image setting for background images
.when using background-image, you should note that it can only use network url or base64, and local images can be tagged with image
.set background images (previews can be displayed on mobile phones and Wechat developer tools)
<view style="background-image: url('https://segmentfault.com/img/bVbbZxX?w=1080&h=517')">absolute</view>when using positioning, you should pay attention to locating the parent
<view class='imgbox'>
<image class='ico' mode='scaleToFill' src='{{ico}}></image>
<text class="txt">{{text}}</text>
</view>.imgbox{
position: relative;
width: 600rpx;
height: 400rpx;
}
.ico{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.txt{
position: relative;
}
<template> <div style="height: 100%;"> <mt-header title=""> <mt-button icon="back" slot="left" v-tap="{methods: switchView, view: Post }">< mt-button> &l...
in the process of using weui, how to find the html structure of this SearchBar after introducing cdn? Neither the rookie tutorial nor W3C says how to use SearchBar ...
$(document).ready(function(){ $(".pageloading").show(); $(window).on("load", function() { $(".pageloading").fadeOut(); }); }); google chrome can, will $( ".pageloading "). FadeOut (); but the safari networ...
there is such a requirement, as shown in the figure are four menu buttons. The four menu icons here are not vector icons similar to Font Awesome, but pictures in png format, namely f.png, u.png, s.png, and p.png. demand: clicking on the correspondi...
directly above the picture, how to take this top value ...
< H1 > problem description < H1 > while writing transition animation, I inadvertently found that sometimes the page would jam, and the Chrome memory of the viewing task manager suddenly soared. After various exclusions, I found that transform:skew (9...
dynamic effects that are often overlooked are so important to user experience design Animation effect is an unavoidable link in user experience design, while in mobile interaction, dynamic effect exists as a transition lubricant and an important lin...
@ media only screen and (min-width:320px) {html {font-size:12px;}} @ media only screen and (min-width:375px) {html {font-size:13px;}} @ media only screen and (min-width:412px) {html {font-size:14px;}} htmlrem1rembodypagepage1rem1rem16px1rem ...
use vue to do a nine-grid lucky draw, which is fast at the beginning, slow down after a few laps, and can control where to stop. There is a big lucky draw button in the middle of the prize. How to write the style, ask for advice ...
to write several mobile pages, you need to use the components provided by ant design mobile to develop. How to use this thing, the document doesn t understand much at first and which of the two ways mentioned above should be used, ah, to find a so...
1. First of all, I have declared my font 2. 3. . 4. However, the above problems only occur in chrome and Firefox, where special fonts are successfully rendered on Safari . ...
the only thing I can think of now is to save the current canvas to an array every time I finish drawing, and then take it out of the array when I undo it ...
.body { background-image:url("image 1.jpg"); } I have tried the following background-image:url ( "1.jpg "); background-image:url ( " image 1.jpg "); background-image:url ( ".. image 1.jpg "); background-image:url ( ".. .. image 1.j...
sometimes normal and sometimes abnormal, use document.body.scrollTop = document.body.scrollHeight;; on the contrary, input will not be pushed up. Can you give me some advice? Thank you when the keyboard pops up, there is a value in document.body....
hover flashes when you move it up. ...
Why ReactDOM.render () cannot render after the page jumps, and it has no effect Page code after jump import React,{Component}from react ; import ReactDOM from react-dom ; import { Flex, WhiteSpace,Button } from antd-mobile ; import U98 ...
the framework of react-based ant design mobile does not write Chinese text directly in the code, so where is the Chinese text written and how should it be used? ask for advice, one for beginners ...
recently encountered a problem, in the cat s eye movie official website to see the normal display of numbers on the page, but to check the source code is a white box, can anyone solve the problem? screenshots of some cat s eye movie pages: ...
use css3 to write a page animation, including width,height,translate,opacity, using chrome to view the number of frames is only 29fsMur31fs, occasionally some will be more than 50 frames, how to optimize to reach the number of 60 frames, and switch to so...
as shown in the picture, this is the menu of a background management system. After I clicked on the small menu, I was clicked to change the color, and only one changed the color at the same time. Ask for demo or link ...