关于可视化大屏适配-爱代码爱编程
一、目前市场上适配方案有两种； vw、vh方案： 原理：按照设计稿的尺寸，将px按比例计算转为vw和vh； 优点：不会存在失真情况、可以动态计算图表的宽高，字体等，灵活性较高，当屏幕比例跟 ui 稿不一致时，不会出
css元素居中技巧分享_css 块元素居中-爱代码爱编程
转自：微点阅读 https://www.weidianyuedu.com 经常碰到有人在问，如何让一个元素上下左右都居中呢？ 相信大家在面试的时候也会经常碰到这个问题，一下列出来几种方式以供大家参考，如有不足之处，请大家补充 问题描述： 给定两个元素，这两个元素
面试必问 -爱代码爱编程
在网页设计中，居中是一个至关重要的布局技巧，能够确保你的页面在不同设备和屏幕尺寸上呈现出优雅的样式。 在这篇文章中，将介绍一些 CSS 居中的基本技巧，适用于各种场景。 1. 水平居中 文本水平居中 通过设置 text-align: center 属性，我们可以使文本在其父容器中水平居中，使得页面内容更易读。 .text-center {
直线围绕中心点旋转（类似时钟）-爱代码爱编程
<view class="circleBoxSecond"> <view class="circleBox"> <div id="clock"> <div class
ajax进阶-爱代码爱编程
一、同步代码和异步代码 同步代码： 异步代码： 同步代码：逐行执行，需原地等待结果后，才继续向下执行。 异步代码：调用后耗时，不阻塞代码继续执行（不必原地等待），在将来完成后触发一个回调函数 二、回调函数地狱和 Promise 链式调用 2.1 回调函数地狱 ： 需求：展示默认第一个
面试前端八股文十问十答第八期-爱代码爱编程
面试前端八股文十问十答第八期 作者：程序员小白条，个人博客 相信看了本文后，对你的面试是有一定帮助的！关注专栏后就能收到持续更新！ ⭐点赞⭐收藏⭐不迷路！⭐ 1）call、apply、bind 实现 这三
一文读懂css中的阴影：box-爱代码爱编程
一、区别 box-shadow 应用于元素，为元素本身添加阴影效果。 text-shadow 应用于文本，为文本内容添加阴影效果。 drop-shadow 是filter属性的一部分，通常用于图像，为其添加阴影效果。 二、box-shadow box-shadow属性用于为元素（如边框）添加阴影效果。 语法： box-shadow: h-s
css面试题-爱代码爱编程
1、css选择器及优先级 选择器优先级：内联样式>id选择器>类选择器、属性选择器、伪类选择器>标签选择器、微元素选择器 注意： !important优先级最高； 如果优先级相同，则最后出现的样式生效；
006 css常见选择器 css伪类 css伪元素-爱代码爱编程
文章目录 CSS选择器什么是CSS选择器选择器分类通用选择器简单选择器(重要)属性选择器(了解即可)后代选择器(重要)兄弟选择器(理解)选择器组(重要) 伪类动态伪类 伪元素(pseudo-elem
css 实现排行榜向上滚动-爱代码爱编程
使用动画实现无线向上滚动 复制一层dom，使用动画向上滚动，鼠标hover的时候暂停动画 <!DOCTYPE html> <html lang="en"> <head>
css设置主题变量-爱代码爱编程
js设置css变量 document.getElementsByTagName('body')[0].style.setProperty('--theme-color', '#5ECB90') js
css实现各级标题自动编号-爱代码爱编程
本文在博客同步发布，您也可以在这里看到最新的文章 Markdown编辑器大多不会提供分级标题的自动编号功能，但我们可以通过简单的css样式设置实现。 本文介绍了使用css实现各级标题自动编号的方法，本方法同样适
css面试题-爱代码爱编程
1、常见的css布局单位 像素px：页面布局的基础，一个像素表示终端屏幕所能显示的最小区域，可分为css像素（为开发者提供，在css中使用的一个抽象单位）和物理像素（只与设备的硬件密度有关，任何设备的物理像素都是固定的） 百分比%：当浏览器的宽度或高度发生变化时，通过百分比单位可以使得浏览器中的组件的宽和高随着浏览器的变
css -爱代码爱编程
浮动 CSS浮动（Float）是一种布局技术，用于控制元素在页面中的位置。通过将元素浮动到其容器的左侧或右侧，可以使其他元素环绕在其周围。 相关属性： float：用于设置元素的浮动方向。可以设置为left（左浮动）
html、css表格的斜表头设置-爱代码爱编程
实现效果 实现代码 <tr class="pb_date content"> <th style="width:80px;"> <div class="olin
flex: 1 是哪些属性的缩写？-爱代码爱编程
flex：1是哪些属性的缩写? flex：1 是 flex-grow: 1, flex-shrink: 1,flex-basis: 0% 的缩写； 解释下flex-grow flex-grow是将剩余的空间，
html实现登录界面-爱代码爱编程
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <
前端开发学习笔记2 （css简介、css基础选择器、css字体属性、css文本属性和css引入方式）-爱代码爱编程
文章目录 CSS简介CSS基本介绍CSS基本语法规范CSS代码风格 CSS基础选择器选择器的作用和分类标签选择器类选择器id选择器通配符选择器 CSS字体属性font-family字体类型设置f
ssm学科竞赛管理系统设计与实现-爱代码爱编程
摘 要 21世纪的今天，随着社会的不断发展与进步，人们对于信息科学化的认识，已由低层次向高层次发展，由原来的感性认识向理性认识提高，管理工作的重要性已逐渐被人们所认识，科学化的管理，使信息存储达到准确、快速、完善，并能提高工作管理效率，促进其发展。 论文主要是对学科竞赛管理系统进行了介绍，包括研究的现状，还有涉及的
uniapp自定义卡片轮播图-爱代码爱编程
效果图 1、封装组件 <template> <view> <!-- 自定义卡片轮播 --> <swiper class="swiperBox" :previous-margin="swiper.margin" :next-margin='swiper.margin' :circular="t