前端开发专题

前端开发中遇到的小问题以及解决方案记录2

1、H5中适配屏幕的工具-postcss-px-to-viewport postcss-px-to-viewport。因为设计稿一般给的都是375px宽度的,所以假如一个字体是16px,那么在开发中不能直接写死为16px,因为各个厂商的手机屏幕大小是不同的,所以要根据屏幕大小去自适应修改px的大小,postcss-px-to-viewport这个工具就能很好地把项目中的px单位自动改为计算后的v

Web前端开发requireJs学习研究(一)

什么是requireJs?有什么用?用了有什么好处?马上稍等一一解答.... 最早的前端Js代码可能如下面这样的代码,相信大家都见过,如下面这段示例代码.. //文件名字 calc.js//内容如下:function add(x,y){return x+y;};function sub(x,y){return x-y;};..... 然后在需要用到这些方法的地方,引用

【前端】ui交互设计是什么?它和前端开发有什么关系

UI(用户界面)交互设计在软件开发过程中扮演着至关重要的角色,尽管它并不直接涉及编写代码,但它与软件专业的关系非常紧密。下面我将详细解释UI交互设计的重要性及其与编程的协作方式。 UI交互设计的重要性 用户体验(UX):UI设计直接影响用户与软件或应用的交互体验。一个设计精良、直观易用的界面可以提升用户的满意度和忠诚度,从而增加产品的市场竞争力。 品牌形象:UI设计也是品牌传播的一部分。通

前端开发主要的工具学习网站

AngularJS 可以构建一个单一页面应用程序  功能强大、开源、美观、图表丰富、兼容绝大多数浏览器的纯js图表 FusionChart实例Demo  纯js图表 库

前端开发这次几个非常经典的常用技巧,学会了之后事半功倍!

对于一个刚入前端的新手来说,在前端开发过程中会遇到各种各样的麻烦和坑,这样很多时候回让开发者的信息受到打击,作为一个稍微好一点的前端菜鸟来说,今天就给刚入前端的新手们分享一些比较实用的开发技巧,让之少走一些弯路。 1.如何知道iframe下载完成做数据分析,一共分几步? 定时器轮询监听readyState的状态,如果是 complete 或者 interactive 说明文件加载完成。 le

前端开发第二节课

HTML常用的标签 文本格式化标签 在网页中,有时需要为文字设置粗体、斜体或下划线等效果,这时就需要用到HTML中的文本格式化标签使文字以特殊的方式显示。 标签语义:突出重要性,比普通文字更重要。 加粗 <strong></strong>或者<b></b>倾斜<em></em>或者<i></i>删除线<del></del>或者<s></s>下划线 <ins></ins>或者<u></u>

【前端开发秘籍】Vue3命名路由,让你的SPA导航更优雅!

Hey小伙伴们,今天要给大家带来的是一个非常实用的前端开发技巧——Vue3中的命名路由使用方法!无论你是前端新手还是资深开发者,都能从中收获满满!👩‍💻✨ 📚 开场白 Hey大家好,我是你们的前端小导师!今天我们要聊的是如何在Vue3中使用命名路由,让我们的单页面应用(SPA)导航更加高效和优雅。🌟 💡 引入话题 想象一下,你正在开发一个复杂的网站,里面有多个视图和嵌套路由。这时

前端开发插件列表

CSS 1、less预处理 2、sass预处理 3、font - awesome (小图标库) 4、animate.css 5、open-iconic (图标库) 桌面端UI框架 1、elementUI 2、bootstrap 移动端UI框架 1、vant 2、ant-mobile 3、mint ui 4、iview 5、uni-app js插件 1、captcha.js (前端验证

MACOS安装配置前端开发环境

官网下载安装Mac版本的谷歌浏览器以及VS code代码编辑器,还有在App Store中直接安装Xcode(里面自带git); node.js版本管理器nvm的下载安装如下: 参考B站:https://www.bilibili.com/video/BV1M54y1N7fx/?spm_id_from=333.999.0.0&vd_source=ffb65e7592d3826cc440355d280

前端开发_HTML5_CSS部分-背景(background)

背景(background) 1.引入    为了更好对内容有更好的颜色搭配和设置,我们可以使用背景做一些美化效果,那么接下来我们一起学习以下背景相关的属性。 2.背景(background)相关的属性样式 背景(background)相关的样式属性1.background-color:设置元素的背景颜色,可以使用关键字,也可以使用HEX和RGB2.background-image:设置背

前端开发_HTML5_CSS部分-内外边距(padding/margin)

内外边距(padding/margin) 1.引入    我们在之前的学习中学习了边框,我们发现只要是页面的标签元素,都可以实现边框的效果,那么接下来我们来讲解一个比较重要的知识点,边距,边距分为内边距和外边距,它们和边框一起是我们后面学习盒子模型的重要基础。 2.内外边距理解    为了更好的帮助广大的学习者理解所讲授的知识点,我们使用现实生活中的一个例子来帮助理解border、padd

前端开发_HTML5_CSS部分-列表属性(list-style)

列表属性(list-style) 1.引入    我们之前在学习标签的时候学习了列表相关的标签,主要有三个:ul-li(无序列表)、ol-li(有序列表)、dl-dt-dd(定义列表),那么下面我们来学习一下用于设置列表相关样式的列表属性:list-style。 2.列表相关属性 list-style列表相关属性1.list-style-type:用于设置在列表显示内容的时候列表项的符号,

前端开发_HTML5_CSS部分-文字(font)/文本(text)

文字(font)/文本(text)属性 1.引入    上一节课我们讲解了有关边框的问题,接下来我们来学习一下有关文字的相关属性,文字的相关属性主要有两个,一个是文字属性:font,另一个则是文本属性:text 。 2.文字属性(font) font文字常用属性1.font-size:用于定义文字的字体大小,一般情况取值为:12px和18px,如:font-size:12px。2.font

前端开发_HTML5_CSS部分-边框(border)

边框样式 1.概述    我们之前已经把CSS的选择器学习了一遍,接下来,我们就一起来学习一下一些常见的样式属性,我们从边框样式开始学习。 2.边框样式    CSS中使用关键字border实现指定元素边框的样式、宽度和颜色。 3.边框的常用属性 边框border常用的属性1.border-style:设置边框的样式,其常用的样式有:none(无边框)soild(实线边框)dashed

前端开发_HTML5_CSS部分(四)

一、CSS相关的特性 1、引入      在上一次课中,我们讲解了如何使用选择器的使用,能够通过选择器给不同的标签添加不同的样式信息。接下来,我们讲解以下CSS中存在的一些样式的特性,这些特性将更好的解决我们理解如何给标签准确的添加相关的样式内容。 2、CSS样式特性      我们将主要讲解三个有关CSS的特性:继承性、叠加性和优先选择性。 3、内容详解      (1)、继承性

前端开发_HTML5_CSS部分(三)

一、CSS选择器(给页面指定的标签添加指定的样式)        1.引入        上一节课,给大家讲解了相关的基本的也是使用最多的选择器,下面我们一起来讲解一下扩展选择器,扩展选择器是基于页面标签架构的一种关系型的选择器。接下来我们一起来学习。        2.分类           扩展选择器主要包含:组合选择器、包含选择器、交集选择器和伪类选择器。        3.详解

前端开发_HTML5_CSS部分(二)

一、CSS选择器(给页面指定的标签添加指定的样式)       1.引入          我们发现一个问题,使用内嵌样式和外部样式都可以进行样式的引入,但是也存在一个问题:页面上同一种类型的元素都被统一成了一个样式,这样就失去了页面元素的多样化。为了解决类似的问题,即既可以给标签添加统一的样式,又可以给单个标签添加特定的样式,就需要学习知识点:CSS选择器。        2.CSS选择器

前端开发_HTML5_CSS部分(一)

一、如何快速的学习CSS内容?     1、精确给页面元素设置样式,掌握三种选择方式。     2、掌握页面每一类型的元素常用的属性内容。     3、像记单词一样记住每一个样式设置之后产生的特效。     4、对于有多属性的样式,记住多属性种最常用的几种样式,减少记忆的数量。 二、CSS概述       层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HT

前端开发_HTML5_标签部分(六)

一、表单(form) 1.表单概述    表单标签是和后台数据交互的一种重要的方式,在网页中使用表单的频率非常的高。一般表单标签中会包含多个控件便于用户在页面输入数据,然后通过指定的方式把数据提交给后台,实现前后台的数据交互。 2.表单标签 - form   (1)、该标签的作用:该标签可以生成一个表单,定义一些表单的相关信息。   (2)、标签语法 form标签的语法:<form na

Vue前端开发必备工具——json-server模拟后端服务器

文章目录 1、简介2、安装3、快速使用(1)创建JSON文件:(2) 启动json-server(3) 使用API(4) 以其它端口号启动(5) 启动多个API 当我们用Vue开发前端时,如果想调用后端接口,又没有真实的后端接口服务器怎么办?答案是:可以用 json-server。 1、简介 Json-server 是一个零代码快速搭建本地 RESTful API 的工具

【前端开发必备小技巧】前端代码规范JavaScript篇

文章目录 🟢 前端代码规范🟢 一、前端代码规范JavaScript篇👉1、JavaScript规范👉1.1、命名👉1.2、代码格式👉1.3、字符串👉1.4、对象声明👉1.5、使用 ES6,7👉1.6、 括号👉1.7、 undefined 判断👉1.8、 条件判断和循环最多三层👉1.9、 this 的转换命名👉1.10、慎用 console.log ✒️总结

前端开发学习Docker记录02容器操作

docker images 先查看有哪些镜像 运行nginx docker run nginx 使用docker ps 可以看到有哪些镜像在运行 docker stats 查看运行状态

前端开发——熟悉WebSocket(包含示例)

最近在开发中需要调用第三方API,现在大家的API基本上都是使用WebSocket来进行的,前端也必须来学一手了 什么是WebSocket 参考:https://blog.csdn.net/L2043524156/article/details/139271715 有如下四个好处: 双向通信:既可以是客户端向服务端发起请求,也可以是服务端向客户端发起请求 持久链接:在没有执行断开链接操作

前端开发中的部分兼容性问题

一般网页通过IE6、IE7、IE8、Firefox5+、Chrome、Safari测试。  IE内核浏览器:360(双核),傲游,搜狗,世界之窗,腾讯TT;  Firefox内核:Gecko  Chrome内核:webkit(Blink)  Safari内核:webkit  Opera内核:Blink 兼容性问题: (1)IE6双倍边距问题。在使用了float的情况下 ,不管是向左还

前端开发面试题——CSS篇

原文地址:https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions/Questions-and-Answers 前言 只看问题点这里 看全部问题和答案点这里 本文由我收集总结了一些前端面试题,初学者阅后也要用心钻研其中的原理,重要知识需要系统学习、透彻学习,形成自己的知识链。万不

Vue.js:解锁前端开发的快速入门之旅

标题:《Vue.js:解锁前端开发的快速入门之旅》 在日新月异的Web开发领域中,Vue.js以其简洁、灵活和高效的特点,迅速成为前端开发者们的宠儿。对于初学者而言,Vue.js不仅是一个易于上手的框架,更是开启现代前端开发大门的金钥匙。本文将带您踏上一场Vue.js的快速入门之旅,探索其魅力所在,助您快速掌握这门强大的技术。 一、初识Vue.js:轻量级与渐进式 Vue.js,一个由尤