前端
而我想成为一个有趣的妞
这个作者很懒,什么都没留下…
展开
-
Vue:The template root requires exactly one element
<template>之间的所有内容都需要用div包起来<template> <div id="client"> <div v-for="(item,index) in productList" :key="index"> {{item.id}} </div> <v-pagination :total="tot...原创 2019-12-24 16:36:51 · 966 阅读 · 0 评论 -
【前端】小图标不显示
问题描述:css:.nav > .uk-inline > button:after { content: "\f107"; font-family: "FontAwesome"; font-size: 14px; line-height: 14px; vertical-align: 0; padding-left: 3...原创 2019-03-23 11:53:00 · 908 阅读 · 0 评论 -
安装vue-cli
前提:已经安装了node和npm安装vue-clinpm install -g vue-cli创建项目vue init webpack todolist(你的项目名称)创建成功启动项目原创 2019-03-29 17:07:30 · 82 阅读 · 0 评论 -
【前端】手机浏览器上面不显示有透明度的颜色
background:rgb(255,255,255,0.60);在电脑上面可以显示 在手机上面却显示不了修改 将background:rgb(255,255,255,0.60); 改成background:rgba(255,255,255,0.60);原创 2019-03-22 11:44:57 · 1624 阅读 · 0 评论 -
【CSS3】CSS画图(随时补充)
效果图:<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8" /> <title>CSS3的乐趣</title> <style> body{ margin: 0; padding: 0; displa...原创 2019-03-12 08:50:17 · 335 阅读 · 0 评论 -
【前端】dashed 间距
效果图<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8" /> <title>Document</title> <style> body{ background: #000; display: flex;...原创 2019-03-20 11:39:18 · 1708 阅读 · 0 评论 -
【前端】手机端导航渐入渐出
效果图:代码<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-s原创 2019-03-15 16:44:56 · 273 阅读 · 0 评论 -
iframe引用YouTube视频 循环播放 自动播放 宽度占满屏幕
<div class="covervid-wrapper two" style="height: auto;"> <iframe id="test" width="100%" height="100%" src="https://www.youtube.com/embed/EMfebeQg2Z4?autoplay=1&loop=原创 2019-01-16 17:40:46 · 7121 阅读 · 3 评论 -
【前端】锚点定位被导航栏遮住了
<span id="product_video" style="margin-top: -102px;padding-top: 102px;"></span>方法:margin-top: 导航栏高度的负值;padding-top: 导航栏高度的正值;原创 2019-01-17 14:59:08 · 3794 阅读 · 4 评论 -
js控制元素
控制元素的class①为当前元素添加一个class:obj.className += " " + 'hide';②为当前元素减去一个class:obj.className = obj.className.replace('hide', " "); 控制元素的位置①当前元素的上一个元素:obj.prevElementSibling ②当前元素的下一个元素:obj.nextEl...原创 2018-12-24 17:00:45 · 320 阅读 · 0 评论 -
jq && js获取input的value值
①var user_id = document.getElementById('user_id').value;②var user_id = $('#user_id').val();原创 2018-12-24 16:34:18 · 50625 阅读 · 1 评论 -
【CSS】伪类里面的文字换行显示
content:"换行\A换行";在设置字体样式的地方添加white-space:pre;原创 2019-03-24 14:41:33 · 2004 阅读 · 0 评论 -
JS写入cookie失败
将文件放到服务器上运行,不要直接是file://这种格式的打开文件参考与:https://segmentfault.com/q/1010000004681381转载 2019-04-23 14:51:15 · 2749 阅读 · 1 评论 -
textarea换行
在文字样式添加white-space: pre-line;只要在textarea换行了 相应的就会显示换行转载 2019-09-04 09:56:27 · 146 阅读 · 0 评论 -
An invalid form control with name='body' is not focusable.
原因:表单中有隐藏项 去掉 hidden原创 2019-08-30 13:01:40 · 1722 阅读 · 2 评论 -
PhotoSwipe添加caption title
HTML中添加data-title<a href="{$link->getImageLink($product->link_rewrite, $imageIds, 'thickbox_default')|escape:'html':'UTF-8'}" data-size="600x700" data-title="{$imageTitle}">js中修改li...原创 2019-08-29 16:47:47 · 408 阅读 · 0 评论 -
Facebook的分享按钮改变样式
<li class="col-sm-6"> <a class="myaccount-link-list-content" id="share_facebook" value="200" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2F要分享的网站域名%2F&src=sdkpr...原创 2019-08-17 10:06:10 · 658 阅读 · 0 评论 -
【前端】网站莫名其妙的都套上了别的标签,例如<strong>
今天打开网站,发现整个页面的字体都加粗了,F12看到所有的元素都被套上了<strong>标签原因:此页面为博客详情列表页,会截取博客详情的一部分作为博客简介显示。他是按照HTML截取的。导致在截取有一篇博客的时候,截取到了<strong>,却没有截取到</strong>,标签不闭合就导致了此博客往下的所有字体都是加粗的。方法:修改博客详情,避免出现只截取到单...原创 2019-06-28 11:56:13 · 4919 阅读 · 0 评论 -
【jQuery】货币格式化
使用插件jquery.formatCurrency.jsHTML<!DOCTYPE html><html><head> <title>美元格式</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></scrip...转载 2019-06-21 08:54:10 · 619 阅读 · 0 评论 -
【前端】HTML图片热点功能
<img src="topperVIdeoBottom.jpg" usemap="#Map" /><style> /*去掉点击area时所产生的边框*/ area{border:0;outline:none;}</style><!-- rect:矩形 --><!-- polygon:多边形 --><map name=...原创 2019-06-15 09:34:03 · 3975 阅读 · 0 评论 -
防止用户过快的点击提交按钮
test.php<form method="post" onsubmit="return CheckFormSubmit();" action="Submit.php" target="target_message"> <div class="ct_msg fl"> Country: <input name="txtCountry" ...原创 2019-05-17 08:57:58 · 425 阅读 · 0 评论 -
直角梯形 圆角
效果图:代码:<style> #trapezoid {width:100px;height:25px;padding:.5em 1em .35em;position:relative;color:#fff;margin-left:100px;transform-origin:bottom right;text-align:center;line-height:25px...原创 2019-05-17 08:50:38 · 1575 阅读 · 0 评论 -
HTML页面复制文字
<xf:formrow label="Referral Code"> <div><span id="invitation_code"></span><span class="copybtn" onclick="copyText()">COPY</span></div> <textarea style=...原创 2019-04-25 17:08:26 · 1800 阅读 · 0 评论 -
【CSS】div上下居中
<div style="width:200px;height:200px; border:2px solid #000;display:flex;justify-content:center;align-items:center;"> <div style="width:100px;height:100px;background-color: red;">&l...转载 2018-12-10 10:01:51 · 135 阅读 · 0 评论 -
【前端】div模拟select(带有滚动条)
之前要在option里面做mouseover事件,在谷歌、火狐、搜狗上面都可以使用,但是IE不支持。在此情况之下,选择用div模拟一个select下面贴代码:html<div class="mod_select"> <ul> <li> <div class="sele...原创 2018-05-11 11:18:25 · 1592 阅读 · 0 评论 -
【前端】js+php实现图片拖拽上传
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>拖拽图片上传</title></head><body> <style type="text/css"&原创 2018-05-17 09:26:27 · 1688 阅读 · 0 评论 -
【报错】js比较数字大小错乱的问题
今天在写js的时候发现,用两个变量来比较大写的时候会发生错乱解决办法:<script type="text/javascript"> $(document).ready(function(){ $('#goumai').click(function(){ var userjifen = Number(document.getElementById('user_ji...原创 2018-07-13 15:16:30 · 1653 阅读 · 1 评论 -
js跳转页面
打开新页面window.open('/index/user/login');跳转页面window.location.href="{:url('user/login')}";刷新当前页面location.reload();原创 2018-07-13 12:57:38 · 1458 阅读 · 0 评论 -
html给input设置提示信息
1、给required设置提示信息<input class="is_required form-control" type="text" id="product_name" name="product_name" value="" placeholder="Apply Product Name" required oninvalid="setCusto原创 2018-07-12 14:28:40 · 8531 阅读 · 0 评论 -
【前端】html5必填项 require
1、text必填项<div class="form-group uk-form-row col-sm-6"> <label class="uk-form-label" for="phone"><sup>*</sup> Phone</label> <div class="uk-f原创 2018-07-05 10:27:50 · 2784 阅读 · 0 评论 -
js获取select的值
//获取select的value值var coach_id =$('#coach option:selected') .val();//获取select的文本值var coach_name = $('#coach option:selected').text();原创 2018-07-17 18:12:10 · 2828 阅读 · 0 评论 -
8款好看的纯CSS3搜索框
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">转载 2018-07-10 12:21:32 · 8573 阅读 · 0 评论 -
【前端】在文本框按回车键搜索
<form method="post" action="/index.php?controller=blog&action=stage" > <input type="text" name="search" id="search" placeholder="Search blog"><button原创 2018-07-09 10:43:41 · 4241 阅读 · 0 评论 -
【前端】点击checkbox后面的文字选中checkBox复选框
1、将input和label放在同一个标签p中2、将lable的for属性值等于input的id属性值即可以实现点击label同时控制input的checkbox<p> <input name="fittype" type="checkbox" value="8" id="check"/> <label for="ch原创 2018-05-24 14:58:13 · 5275 阅读 · 0 评论 -
【报错】fatal: refusing to merge unrelated histories
操作:git pull --allow-unrelated-histories origin master原创 2018-08-03 13:17:01 · 191 阅读 · 0 评论 -
【前端】图片自动轮播,可控制轮播方向(与uikit结合使用)
介绍:产品图自动轮播鼠标悬于左右箭头上方的时候自动切换轮播方向鼠标悬于产品图上方的时候停止轮播,让用户可以查看产品信息,鼠标移开,继续轮播注意点:ul中切勿使用uikit中的uk-grid,否则反向轮播的过程中到第一个产品就会一直闪烁,不继续展示前面的产品代码:<link href="https://cdnjs.cloudflare.com/ajax/libs/...原创 2018-10-12 11:56:43 · 1115 阅读 · 0 评论 -
【前端】引用svg图片
1.可以正确显示 ,但是链接全部失效 <embed src="rect.svg" type="image/svg+xml">2.如果是在a里面使用svg图片的话就这样写<img src="list.svg">原创 2018-11-28 15:45:43 · 8131 阅读 · 0 评论 -
【CSS】水平镜像旋转
css:.jingxiangrotate{ transform: rotateY(180deg); -ms-transform:rotateY(180deg); -moz-transform:rotateY(180deg); -webkit-transform:rotateY(180deg); -o-transform:rotat...转载 2018-11-28 15:44:38 · 1856 阅读 · 0 评论 -
【CSS】修改css文件不生效
1.F12查看css样式,看是否被别的样式覆盖了,如果覆盖可以使用!important强制修改css样式2.在网页上面Ctrl+F5强制刷新3.只针对于使用了加速器的网站。登录加速器的账号---高速缓存---自定义清除---输入css文件的链接目前只接触到这三种,第二种情况遇到的比较多,以后遇到别的再补充。...原创 2018-11-30 15:28:04 · 3568 阅读 · 4 评论 -
【CSS】渐变色
效果图: css: background: -webkit-linear-gradient(left, #d2b969, #f3ebcd, #d2b969); background: -o-linear-gradient(left, #d2b969, #f3ebcd, #d2b969); background: -moz-linear-gradient(left...转载 2018-11-25 21:47:32 · 264 阅读 · 0 评论