![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
css
wiry_碎碎念
这个作者很懒,什么都没留下…
展开
-
vue在scss中引入js变量动态改变背景图片
vue在scss中引入js变量动态改变背景图片原创 2023-06-28 17:55:29 · 2360 阅读 · 0 评论 -
vue中动态改变盒子高度
【代码】vue中动态改变盒子高度。原创 2023-04-28 17:21:11 · 481 阅读 · 0 评论 -
css虚线
【代码】css虚线。原创 2023-04-15 13:21:22 · 191 阅读 · 0 评论 -
css横向滚动滑动
【代码】css横向滚动滑动。原创 2023-04-04 14:33:04 · 153 阅读 · 0 评论 -
外边距合并-嵌套块元素塌陷问题
嵌套块元素塌陷问题及解决方案原创 2022-11-09 10:52:58 · 82 阅读 · 0 评论 -
CSS文字省略
单行overflow: hidden;white-space: nowrap;text-overflow: ellipsis;多行display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;原创 2022-03-05 21:55:41 · 1254 阅读 · 0 评论 -
CSS基础知识(一)-基础选择器(标签选择器、类选择器、id选择器、通配符选择器)
概述选择器可分为基础选择器和复合选择器两大类。基础选择器由单个选择器组成基础选择器包括:标签选择器、类选择器id选择器、通配符选择器标签选择器标签选择器(元素选择器)是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签指定同一的CSS样式。语法: 标签名 { 属性1: 属性值1; 属性2: 属性值2; 属性3: 属性值3; … }效果: <div>div1</div> <div>di原创 2022-01-05 09:58:23 · 3077 阅读 · 0 评论 -
css中子绝父相布局
解决问题:实现左右小圆圈分别居中贴近图片左右侧实现思路:父盒子:tb-promo(相对定位)子盒子:prev和next(绝对定位,设置偏移量)实现效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta原创 2021-12-30 21:21:32 · 127 阅读 · 0 评论 -
CSS基础知识(三)-元素显示模式(块元素、行内元素、行内块元素)
概述元素显示模式就是元素(标签)以什么样的方式进行显示。HTML元素一般分为块元素和行内元素两种类型块元素常见的块元素有~、、、、、等块级元素特点:自己独占一行高度,宽度,内外边距都可以控制宽度默认是容器(父级宽度)的100%是一个容器及盒子,里面可以放行内或者块级元素注意:文字类的元素内不能使用块级元素标签主要用于存放文字,因此里面不能放块级元素同理,~等都是文字类块级标签,里面也不能放其他块级元素行内元素常见的行内元素有、、、、、、等行内元素特点:相邻行内原创 2022-01-05 15:12:37 · 680 阅读 · 0 评论 -
CSS基础知识(二)-复合选择器(后代选择器、子选择器、并集选择器、伪类选择器)
概述复合选择器由两个或多个基础选择器,通过不同的方式组合而成的复合选择器包括:后代选择器、子选择器、并集选择器、伪类选择器等等后代选择器后代选择器又称为包含选择器,可以选择父元素里面子元素。其写法就是把外层标签写在前面,内层标签写在后面,中间用空格分隔。当标签发生嵌套时,内层标签就成为外层标签的后代。语法: 元素1 元素2 { 样式声明 }效果: <ul> <p>我是p</p> <li><p>原创 2022-01-05 11:30:28 · 908 阅读 · 0 评论 -
html+css实现小米商城首页
实现效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <原创 2021-12-30 22:33:45 · 991 阅读 · 2 评论 -
html+css实现淘宝焦点图
实现效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t原创 2021-12-30 22:08:44 · 471 阅读 · 0 评论