qq_38210427的博客

1.1 固定定位是相对于根元素的，或说固定在浏览器视窗。

Absolute定位是相对于 static（position默认值）定位以外的第一个父元素进行定位，如果不存在已定位的父元素，则相对于body元素。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。脱离文档流不占空间。Fixed和Absolute都是CSS中定位的属性，它们用于控制元素在页面中的位置，其中Fixed表示固定定位，Absolute表示绝对定位。Absolute定位的常用场景是实现页面中的局部定位，例如可以实现图片的悬浮效果、文字的重叠等。

"user-select: none" 是 CSS 中的一个属性，它可以用来禁止用户选择文本内容。这个属性可以防止用户复制网页上的文本内容，或者在网页中使用鼠标拖动选中文本。通常，这个属性会在网页上的一些不希望被用户修改或复制的内容(例如版权声明、注意事项等)上使用。这样，用户就不能在这个 div 元素中选择文本内容了。

flex布局是前端常用的布局方式之一，但在使用过程中，我们总是感觉不太方便，因为日常开发中，大多数时候，我们想要的效果是这样的即左右两端对齐并顶满，小盒子左右间距一致，并且从左至右排布。今天主要就来讨论，通过css，有几种方式来实现，以及它们的优缺点。<template>...</div></div>如上代码所示，我打算弄一行四列，所以我在最后面加了四个空标签// 设置成为flex模式// 允许换行// 为了让两边对齐width: 22%;

在Vue 3中，如果你遇到了使用伪类(:hover)时背景图片出现闪烁的问题，可能是由于浏览器的渲染机制导致的。标签内或者外部CSS文件中添加上述样式。这样，当你悬停元素时，背景图像应该会平滑过渡，而不会出现闪烁。属性来固定背景图像的位置，防止在:hover状态下背景图片移动导致的闪烁。现象： hover时候，图片还没加载出来，导致边框闪烁。，确保背景图像覆盖整个元素，避免因尺寸变化引起的闪烁。属性来平滑过渡背景变化，减少闪烁感。在Vue 3的组件中，你可以在。

这个问题通常是由于数字字体的下排的问题造成的，也就是数字的底部边缘位置比汉字的顶部边缘位置更靠下。如果是在网页中出现的问题，可以尝试使用等宽字体，这样可以避免字体本身的下排问题。请根据实际情况选择合适的方法，并结合具体的HTML结构和设计需求进行调整。属性来减小行高，使得行间的距离减小，看起来数字比汉字要靠上。属性来调整对齐方式。例如，可以将数字的对齐方式设置为。，可以使容器内的项目垂直方向上对齐到容器的顶部。值来拉动数字使其更靠上。(代码里使用了这个)使用Flexbox布局模型，并设置。

n 可以用css样式 white-space: pre-wrap。<br/>的话 用 v-html。

【代码】长方形+ 下三角形的图形 css。

长方形的位置。

原因：行内元素的默认对齐方式是基线对齐即（vertical-align：baseline），设置设置overflow不为visible之后改变了他的默认对齐方式为下边距边缘；其他行内元素依然还是基线对齐就会出现下沉的视觉效果。1、重新设置所有行内元素的对齐方式为vertical-align:top或者bottom。当设置overflow:hidden之后，元素出现不对齐的情况。2、设置所有的行内元素的overflow不为visible。父级元素包含几个行内元素。正常显示，且在同一行；3、设置flex布局。

参考：各种弧度的写法。

添加min-width：缩小出现滚动条。

【伪类与伪元素】用CSS伪元素（以:before为例）插入图片对于一些小图标类型的图片，若使用<img>略微有些麻烦，iconfont是一个不错的选择用起来也相当灵活，但是所需要步骤较为繁琐，今天介绍一种使用css伪元素快速插入图标的小技巧。效果图伪类 与 伪元素伪类在网上很多篇博客中并未将这两个解释清楚，很多博客直接写到利用css伪类插入图片，这种说法严格来讲是错误的。CSS 伪类 是添加到选择器的关键字，指定要选择的元素的特殊状态[1]。通俗来说就是：

【代码】下一步步骤条。

上下固定高度， 中间 flex:1。可以使用flex 布局。

当我们为div标签或者p标签等设置了宽度，会出现文本溢出并且不会换行的情况，一般这种情况都是只有文本内容为单词或者纯数字的时候出现的。原因是由于：浏览器在解析我们页面的时候，给这一串数字当成一个词了，这样就不会自动切断字符串而进行换行。方法一：内容到达指定宽度强行断句换行，一个单词显示不开将会截断换行继续展示；方法二：当前单词在宽度内无法展示，整个单词换行展示；CSS中设置了宽度，但是其中的内容溢出而不换行。

常用的background背景属性详细~~干货_background-size-优快云博客

【代码】聊天框布局（vue3）

首先要把中fill="currentColor"，不改没有效果。

使用最小高度： 默认撑满全屏，超出出现滑动条。