这是我的CSS:
.banner-text-BG {
background: #00A7E1 url(images/sale_tag.png) left center no-repeat !important;
background-size: 20px 20px;
height: auto;
padding: 15px;
position: static;
width: auto;
-webkit-border-radius: 70px 10px 10px 70px;
-moz-border-radius: 70px 10px 10px 70px;
border-radius: 70px 10px 10px 70px;
padding-left: 70px;
}
Run Code Online (Sandbox Code Playgroud)
与所有其他风格相反,"背景大小:20px;" 对我的页面没有影响,在Firebug中不可见,并且旁注不会在Notepad ++中突出显示为有效的CSS指令.与"background-size:20px;"相同 或"background-size:20px auto;"
我错过了什么吗?为什么不起作用?
我的flex容器有一个水平的项目列表,所有浏览器都在它们的父项中正确显示,除了IE11,它似乎无法将它们保留在其中,而是它们"流出"它,如下所示:
下面是我的设置的简化小提琴,它演示了操作中的问题:
ul, li {
list-style: none;
margin: 0;
padding: 0;
}
ul {
display: flex;
width: 200px;
border: 1px dashed red;
}
li img {
max-width: 100%;
height: auto;
}Run Code Online (Sandbox Code Playgroud)
<ul>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
<li><img src="http://i.imgur.com/60PVLis.png" width="50" height="50" alt=""></li>
</ul>Run Code Online (Sandbox Code Playgroud)
任何解决方法?
Gulp的新功能,不知怎的,我在全局和本地安装了不同版本的Gulp,触发版本不匹配警告消息.我可以在不影响本地安装的情况下全局卸载Gulp吗?
plus在电话链接中包含空格和符号(国际代码)是否有任何错误或问题?例:
<a href="tel:+46 000 00 00 00">+46 000 00 00 00</a>
(我在这里用0替换了我想要使用的实际数字)
每次我尝试创建一个新项目(vue create my-project)时,我都会收到此错误:
错误:命令失败:npm install --lllvel错误
我在PC/Windows 10,Vue-cli 3.2.1,节点8.11.3,Npm 5.6.0.预设:Babel,ESLint和Prettier,SASS,Vue路由器,Vuex
从日志中:
2736傻saveTree` - vuex@3.0.1
2737 warn ajv-keywords@2.1.1需要ajv@^5.0.0的对等体,但没有安装.您必须自己安装对等依赖项.
2738详细堆栈错误:EINVAL:无效参数,读取
知道这意味着什么以及如何解决它?
编辑:我发现排除任何lint功能使问题消失.所以问题就变成了:我怎样才能使用linting并使其工作?
Flexbox justify-content: space-around使我的列表项水平均匀分布.有没有办法让完全相同的东西,唯一的区别是左边的第一个项目左边没有空格?(即,列表从容器的左边缘"开始")
除了source maps在Chrome中启用之外,在我的gulpfile.js中,我根据这个答案进行errLogToConsole: true, sourceComments: 'map', sourceMap: 'sass'调用时使用它作为参数:sass
gulp.task('sass', function() {
return gulp.src('../assets/styles/**/*.scss')
.pipe(plumber({ errorHandler: onError }))
.pipe(sass({errLogToConsole: true, sourceComments: 'map', sourceMap: 'sass'}))
.pipe(autoprefixer())
.pipe(gulp.dest('../dist/styles'))
.pipe(browserSync.reload({
stream: true
}))
});
Run Code Online (Sandbox Code Playgroud)
然而SCSS内容仍然没有出现在DevTools中.为什么?
注意:源映射注释确实显示在已编译的CSS中,如下面的屏幕截图所示
在我的Nuxt/Vuetify应用程序中,我试图在 Vuetify's CSS之后加载我的自定义CSS,但是Vuetify's CSS 无论如何都会在之后加载。我试图颠倒 CSS 数组中的顺序:
css: [
'~/assets/style/main.scss',
'~/assets/style/app.styl'
],
Run Code Online (Sandbox Code Playgroud)
...并交换这些,无济于事。
关于这个主题的先前问题的流行加上其缺乏答案让我认为问题在Vuetify'一边,作者没有费心去解决这个问题。
但也许这不是正确的解释,确实有解决方案?
我通常使用Gulp将我的CSS捆绑为一个最小化文件,然后从CDN分别导入FontAwesome,Google字体或插件文件等资源.这是最好的选择还是下载这些第三方资产然后将它们与我们的代码捆绑在一起作为一个文件更好的性能?
Myv-select的数据是一个对象数组。对于每个项目,value是一个属性,text而该项目的 是不同的属性。但是我真的需要检索两者,而不仅仅是value.
所以我想我需要检索对象。是否可以?
V-选择代码:
<v-select
:items="projects"
v-model="project"
item-text="projectName"
item-value="projectId"
solo
></v-select>
Run Code Online (Sandbox Code Playgroud)
这是填充项目数组的方式(在安装的钩子中):
querySnapshot.forEach((doc) => {
let data = {
'projectId': doc.id,
'projectName': doc.data().name,
'clientId': doc.data().clientId
}
this.projects.push(data);
});
Run Code Online (Sandbox Code Playgroud) css ×4
gulp ×3
vue.js ×3
css3 ×2
flexbox ×2
vuetify.js ×2
background ×1
html ×1
nuxt.js ×1
sass ×1
source-maps ×1
vue-cli ×1
webpack ×1
workflow ×1