css
文章平均质量分 52
风清云淡_A
知识在于积累,成功在于坚持
展开
-
怎样设置webstorm中的deploment 在移动设备上预览
这几天写H5,需要在手机端上预览效果,所以折腾下webstorm配置,是可以实现的,百度了很多都实现不了,结合我自己的实际,记录下配置方法到这里的时候就一直显示黄色的错误提示尝试的在deployment那里加个/,错误提示就消失了预览的时候又出现了404,想死的心都有,百度都找不到原因。。。最后自己在ip地址后面加了个文件夹路径,就正常预览了然后去草料登二维...原创 2018-12-12 15:43:26 · 342 阅读 · 0 评论 -
vue3.0封装dropdown下拉菜单
vue3.0出来已经有段时间的了,也与必要开始研究它了!先看下我们要实现的效果很常见的展开显示菜单项的内容,在vue3.0里面怎么开发,这里样式我们用的是bootstrap的默认样式思路一: <DropDown :title="'退出'" :list="menuLists" />思路二: <drop-down :title="'退出'"> <drop-dowm-item>新建文章</drop-down-item> <dro原创 2021-07-10 23:50:23 · 3567 阅读 · 6 评论 -
BFC与清除浮动 的思想方法
BFC(Block Formatting Context)直译为“块级格式化范围”。它是指一个独立的块级渲染区域,只有Block-level BOX参与,该区域拥有一套渲染规则来约束块级盒子的布局,且与区域外部无关。概念很抽象,根本看不懂,举个例子吧<div> <ul style="float:left"> <li>1</...转载 2018-08-14 11:12:12 · 317 阅读 · 0 评论 -
less预处理语言的运用之-变量拼接那点事
less语法的技巧总结,很基础,熟练掌握后能提高我们在大型项目中的开发效率。原创 2023-07-10 15:10:09 · 1435 阅读 · 0 评论 -
css里面的bfc概念的简易记录
3.display属性为table-cell,table-caption,inline-block中的一个。5.width/min-width/height/min-height不为auto。4.position属性不为relative或者static。2.父级的overflow不为visible。1.zoom不为normal。1.父级float不为none。原创 2022-09-21 06:18:13 · 127 阅读 · 0 评论 -
css中超出几行后文字隐藏,显示...的问题
在要做这种效果的div/p元素上是不能设置高度的,某种不生效,最终代码,但是不设置高度导致并列的div高度不一致,出现div由文字内容来撑起高度,层次不齐得不美观界面,于是把高度转移到父级上面去就可以了。2.当前元素上加高度,同时设置超出溢出省略号,省略号不生效了。最终方案:把高度转移到父级上面去就可以了。...原创 2022-09-01 11:49:40 · 1467 阅读 · 0 评论 -
elementui搭建后台管理系统顶部和底部,左侧固定,中间的内容部分滚动的布局
做后台管理系统时,比较使用的搭建方法,实现这种顶部和底部,左侧固定,中间的内容部分滚动的布局相关源码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi原创 2021-12-03 14:07:43 · 1449 阅读 · 0 评论 -
css3实现加载进度条的效果(二)
css3实现光效加载的进度条,下面来看实现方法! <div class="progress-bar orange shine"> <span id="blue"></span> </div>主要的css代码.progress-bar { width: 350px; background-color: #1a1a1a; height: 35px;原创 2021-08-02 23:32:04 · 325 阅读 · 0 评论 -
css3实现加载进度条的效果(一)
记录下css3学习中的有趣的地方,先看下我们的实现效果!很简单,但是需要有css设计思想才能做到,<div class="progress-bar blue stripes"> <span id="blue"></span> </div>这要的html就这两个黑色背景 body{ background: url("./bg.png") repeat; } .progres原创 2021-08-02 23:18:17 · 656 阅读 · 0 评论 -
vue2+vuecli3+elementUI后台管理系列之dashboard工作台的布局开发(四)
经过前面的三节内容的准备工作,终于到了我们要实现页面的一节了。接下来我们要实现的是类似于下面的这种中后台的布局。让我们一步步来实现吧!dashboard.vue<template> <div class="app-wrapper"> <div class="sidebar-container"> 这是左边的导航 </div> <div class="main-container"> <原创 2021-07-24 23:26:55 · 4231 阅读 · 13 评论 -
元素float,relative,absolute,fixed之后层级的高低浅析
主要记录的是谁覆盖谁的问题。测试环境chrome浏览器 元素float——一个元素浮动,另一个元素不浮动 <div class="pareant"> <div class="son son1"> son <span>span</span> </div> <div c...原创 2019-07-30 10:28:54 · 3544 阅读 · 2 评论 -
css-reset样式重置
移动端:html, body { -webkit-user-select: none; /* 禁止选中文本(如无文本选中需求,此为必选项) */ user-select: none; } a, img { -webkit-touch-callout:none; /* 禁止长按链接与图片弹出菜单 */}body,inpu...原创 2019-07-04 09:30:31 · 170 阅读 · 0 评论 -
H5移动端软键盘弹起的问题
autofocus(); //ios完成按键的点击事件 function autofocus() { $('.telInputLogin').on('blur',function () { if($(this).val().length == 11){ $('.pwsInput1Login').focus()...原创 2019-01-15 10:12:56 · 1466 阅读 · 0 评论 -
chrome浏览器下,input框自动记录数据的黄色背景
在做手机H5页面,chrome里面测试的效果,这个黄色有点难看;发现是chrome专有的input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset;}input[type=text]:focus, ...原创 2018-11-15 14:15:29 · 244 阅读 · 0 评论 -
css实现可以计算的自适应布局—calc()
css部分.box{ width:500px; height:300px; } .left{ width:250px; background: #ccc; float:left; } .right{ ...转载 2018-07-30 13:24:33 · 409 阅读 · 0 评论