css
关注
分享
扫一扫
文章平均质量分 79
bdawn
JS全栈|软件工程师，负责公司所有前后端项目的开发和管理。
展开
-
html+js+css实现一个圆形滑块
产品经理设计了这样一个需求，通过拖动圆形滑块实现时间的设置功能，虽然看着有点复杂，但是确实有点复杂。原创 2023-10-29 23:41:27 · 1596 阅读 · 5 评论 -
css z-index属性的适用范围
z-index属性的适用范围z-index属性使用在下面两种html元素中才会生效position属性设置为除static的其他属性值的元素display设置为flex的子元素设置position的情况不设置position<style> .green{ width: 50px; height: 50px; z-index: 2; background: green; } .blue{ width: 100px; height: 50px; ma原创 2021-08-22 09:17:51 · 703 阅读 · 0 评论 -
css animation动画
css animation动画animation为html元素不同style样式的切换过程添加过渡动画直接上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>动画</title> <style> .ani { width: 100px; h原创 2021-03-18 16:49:26 · 330 阅读 · 0 评论 -
css border-image
css border-image基本原理将给出的图片分割为九宫格，将九宫格四个角位置的部分放置在元素四个角上，然后将上下左右四个部分放置在元素四个边上再根据参数进行拉伸或者平铺示例示例代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .原创 2021-03-09 16:52:44 · 341 阅读 · 0 评论 -
css 浮动 float
css float使用方式float:left;可设置的值为：left | right | none默认为none，开启浮动元素开启浮动之后的特点元素会向左或向右移动，直到碰到离他最近的盒子容器或者其他开启浮动的元素文本或者行内元素会环绕在浮动元素周围浮动元素如果未设置高度，它的高度会被浮动的子元素的内容撑开元素的display属性的部分值会被改变浮动前浮动后inlineblockinline-blockblockinline-tabletab原创 2020-11-23 18:37:24 · 212 阅读 · 0 评论 -
css margin外边距折叠
两个div同时设置外边距时，他们中间的外边距会叠加在一起，以最大的为准，而不是两个相加div{ width: 100px; height: 100px;}.div1{ background-color: pink; margin-bottom: 50px;}.div2{ background-color: orange; margin-top: 100px;}<div class="div1"></div><div class="div2">原创 2020-11-05 16:12:29 · 134 阅读 · 0 评论 -
收藏！40 个 CSS 布局技巧
版权声明：本文为优快云博主「阿里技术官方号」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。原文链接：https://blog.youkuaiyun.com/alitech2017/article/details/107460459简介：CSS是Web开发中不可或缺的一部分，随着Web技术的不断革新，CSS也变得更加强大。CSS的众多属性你知道了多少？具体开发中该使用什么属性才最适合恰当？如今的一些CSS属性可以让我们节约更多的时间。比如在Web布局中，现代CSS特性就可以更.转载 2020-07-20 12:54:13 · 385 阅读 · 0 评论 -
grid layout网格布局详解
参考文档 MDN web docs什么是网格容器网格布局的特点网格grid css属性介绍网格item css属性介绍原创 2020-07-02 17:23:59 · 7891 阅读 · 0 评论 -
css实现列表局部放大和压缩效果
不废话先看效果代码分析布局和js代码<body> <div class="content"> </div> <template id="my-temp"> <div class="temp"> <div></div> <div></div> </d...原创 2019-10-09 17:18:40 · 805 阅读 · 0 评论