关注
分享
前端开发是创建WEB页面或APP等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互 。
柠夏小白
Lifelong learning is the beginning of romance！
From 0 to 1,Internship record good life!
展开
-
还不会垂直水平居中？六种方法教你实现、适应多种应用场景！
考题：一个300*300的div在不同分辨率屏幕中上下左右居中，如何用css实现？一、绝对定位方法：设置margin-left，margin-top值为当前div宽高一半的负值.Center { width: 300px; height: 300px; background: wheat; position: absolute; left: 50%; top: 50%; margin-left: -300px; margin-top: -原创 2021-05-31 15:23:47 · 245 阅读 · 20 评论
-
排序值为0时不显示值，为--
添加功能—排序值输入’0’时，显示“–”，前端查看后并未做任何逻辑为0时判断将文中 customRender: ({ text, record, index }: any) => text || "--" ‘||’ 修改为“??”原创 2022-04-14 10:28:47 · 392 阅读 · 0 评论 -
vue实践项目— ‘取消‘ 按钮事件返回上一页
UI库：Ant Design of Vue取消按钮（需求：点击按钮返回上一页）：<a-button @click="$router.back()">取消</a-button>原创 2022-03-10 14:06:54 · 2038 阅读 · 0 评论 -
解决报错：npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.原创 2022-07-06 15:18:40 · 2712 阅读 · 1 评论 -
Ant-Design Table组件文本溢出，希望只展示一行多余以...显示
测试提交需求优化：备注信息字段过长，建议只展示一行，超过以…代替，鼠标悬浮气泡展示全部文本信息前端优化需求：//给Table的column添加鼠标悬浮提示：nextTick(()=>{ var rowsDom = document.getElementsByClassName("ant-table-row-cell-break-word"); rowsDom.forEach(item1=>{ if(item1.nodeName === "TD"){原创 2022-04-14 16:54:10 · 1788 阅读 · 0 评论 -
HTTP状态码及Content-Type
当浏览者访问一个网页时，浏览者的浏览器会向网页所在服务器发出请求。当浏览器接收并显示网页前，此网页所在的服务器会返回一个包含 HTTP 状态码的信息头（server header）用以响应浏览器的请求。HTTP 状态码的英文为 HTTP Status Code。下面是常见的 HTTP 状态码：200 — 请求成功；301 — 资源（网页等）被永久转移到其他URL；404 — 请求资源（网页等）不存在；500 — 内部服务器错误。响应分为五类：信息响应 (100–199)，成功响原创 2022-02-18 11:26:59 · 1646 阅读 · 0 评论 -
VSCode中书写Vue无代码提示，如何解决？
今天在配置VSC简便插件及实用技巧后书写Vue代码时，发现代码无提示，经过几轮查询资料后发现了问题所在，现给出解决措施。第一步：我下载了 Vetur 和 Vue 2 Snippets 两个插件，随后创建了Vue模板，发现Vue并没有语法模板提示；第二步：随后查询资料，发现还需要安装新插件 HTML Snippets ，然后进行 setting.json 文件配置: ”文件“—”首选项“—”设置“—”文本编辑器原创 2022-02-09 12:07:24 · 58887 阅读 · 29 评论 -
VSCode简单使用好插件，如何设置自动保存?
常用插件： 1.Open in Browser 在浏览器打开； 2.Material Icon Theme 扁平化的主题图标库； 3.Auto Close Tag 代码自动闭合； 4.Auto Rename Tag 尾部闭合标签同步修改； 5.Highlight M原创 2022-02-09 10:57:59 · 13690 阅读 · 0 评论 -
手写CSS3动画—爱心i love you
HTML部分：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>傻逼 没有下次了</title> <!-- 引用CSS样式 --> <link rel="stylesheet" type="text/css" href="css/index.css"/> </head> <body>原创 2022-02-07 00:02:22 · 509 阅读 · 0 评论 -
在HBuilderX、VScode添加一个自定义模板
废话不多说，直接上步骤：第一步：新建一个固定的模板vue.html，编辑好所需内容后，创建、保存即可；第二步：退到桌面，找到“HBuilderX.exe”快捷方式，右键“打开文件所在位置”，跟随我的步骤来就好了；具体文件夹步骤：HBuilderX\plugins\templates\file\html第三步：往后新建模板内容时，直接添加即可，无需重复手写代码啦！...原创 2021-12-25 18:50:39 · 6865 阅读 · 1 评论 -
nth-child()伪类选择器实现奇偶行背景色样式
CSS 伪类(Pseudo-classes)今天首要讲解一下，怎么用CSS伪类选择器实现奇偶行背景色样式 奇偶匹配 :nth-child(odd)与 :nth-child(even) 分别匹配序号为奇数与偶数的元素。 奇数(odd)与(2n+1)结果一样；偶数(even)与(2n+0)及(2n)结果一样。废话不多说，上代码诠释：<!DOCTYPE html><html lang="en"> <head> <meta charse原创 2021-11-10 09:15:41 · 1176 阅读 · 0 评论 -
CSS HTML实现后，却发现与屏幕宽度不一致，超出部分如何解决？
div宽度与屏幕的大小不一致，试了很多方法无法解决！咱们这次要实现的是宽度自适应，与屏幕大小一致，可是但整体的内容编程出来后却是”宽度超出很多，如下图：“相信大家都有遇到过这种类似情况，在我上网搜索了解决方法后，仍然不能解决我的超出宽度。（第一种使用：width：auto; overflow：hidden）（第二种使用：宽度：100％;填料;箱上浆：边界框;）下面是我的解决方案，首先使用一个meta标签屏幕的自适应宽度，然后加使用一个大div包裹住，使用CSS样式将屏幕宽度去掉,下面奉上代码图原创 2021-04-05 19:42:38 · 4517 阅读 · 5 评论 -
背景图宽度100%，CSS样式自适应
实现登录页面：引用CSS样式：<style> body { width: 100%; background-image: url(Imgs/首页.jpg); background-repeat: no-repeat; background-size: 100% auto; }</style>实现效果：希望对小伙伴有所帮助，哈哈哈！...原创 2021-04-19 11:39:05 · 431 阅读 · 0 评论 -
精美注册界面模板 HTML+CSS样式
注册页面效果图：附源码：<!DOCTYPE html><html lang="zh-CN"><head> <title>紫色背景简洁登陆页面</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!--图标--> <link rel="s原创 2021-04-23 19:01:54 · 8459 阅读 · 2 评论 -
块级、行内标签记不住？两张图搞定它
行元素：不会独占一行，width 和 height 会失效，并且在垂直方向的 padding 和margin 会失效。（2）行内元素不会独占一行，相邻的行内元素会排列在同一行，直至一行排不下才会换行，其宽度随元素的内容而变化；块元素：独占一行，并且有自动填满父元素，可以设置 margin 和 pading 以及高度和宽度；（3）块级元素可以包含行内元素和块级元素；行内元素不能包含块级元素。（1）块级元素会独占一行，其宽度自动填满其父元素宽度；原创 2021-05-02 17:33:51 · 204 阅读 · 0 评论