css
关注
分享
扫一扫
認真的雪
雪下的那么深，下的那么认真
展开
-
Grid宫格布局
// 固定数量和宽度 display: grid; grid-template-columns: 90px 100px 110px; grid-template-rows: 110px 100px 90px; // 固定数量，宽度自适应 display: grid; grid-template-columns: repeat(3, 33.33%); grid-template-rows: repeat(3, 33.33%); // 固定宽度，数量自适应 display: grid;.原创 2024-08-29 17:29:39 · 275 阅读 · 0 评论 -
div四角边框直角、倒角、 圆角、倒圆角
只用一个div实现边框直角、倒角、 圆角、倒圆角样式自调 <div class="box_border_radius"></div>.box_border_radius{ width: 100px; height: 100px; background: linear-gradient(135deg, #fff 20px, transparent 0) top left, radial-gradient(circle at 0% 100%, transparent 1原创 2021-11-10 10:49:24 · 7137 阅读 · 0 评论 -
CSS实现渐变梯形
一个div实现渐变梯形 <div class="tixin"></div>.tixin{ width: 200px; height: 200px; transform-origin: 50% 100% 0; transform: perspective(300px) rotateX(45deg); background-image: linear-gradient(0deg, rgba(153, 153, 153, 0.5), transparent); pos原创 2021-11-10 09:44:52 · 1116 阅读 · 0 评论 -
CSS圆角边框渐变
一个DIV实现圆角边框渐变<div class="box"></div>.box{ width: 713rpx; height: 80rpx; border-radius: 100rpx; border: 5rpx solid transparent; background-origin: border-box; background: linear-gradient(0deg, #E24556, #E82148, #F35F77原创 2021-10-22 18:48:08 · 781 阅读 · 0 评论 -
CSS :hover闪烁问题
链接: link.图片: 带尺寸的图片: 居中的图片: 居中并且带尺寸的图片:原创 2021-09-23 14:13:58 · 1397 阅读 · 0 评论 -
base.scss
@charset "utf-8";* { padding: 0; margin: 0;}/*fieldset组合表单中的相关元素*/input { outline-style: none;}/* 去掉 table cell 的边距并让其边重合 */table { border-collapse: collapse; border-spacing: 0;}/* 去掉列表前的标识，li 会继承 */ol,ul { list-style: none;}/* 默认不原创 2021-09-04 22:43:09 · 227 阅读 · 0 评论 -
html笔记
HTML笔记结构标签和属性样式结构<!DOCTYPE html> document type doctype(文档)<html> 开始 <head> 开头 <!--网站配置--> <meta charset="utf8"> 编码设置（utf8 支持中文） <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"> 为搜索引擎定义关键词: &原创 2021-04-16 22:52:25 · 205 阅读 · 0 评论 -
html文本超过两行隐藏
文本超过两行隐藏单行隐藏.hidden{ white-space: nowrap; /* 文本不换行 */ overflow:hidden; /*隐藏超出的内容*/ text-overflow: ellipsis; /*省略号(...)*/}多行隐藏.hidden-2{ display:-webkit-box;/*对象作为伸缩盒子模型展示*/ -webkit-box-orient:vertical;/*设置或检索伸缩盒子对象的子元素的排列方式*/ word-break:break-a原创 2021-04-16 20:41:20 · 642 阅读 · 0 评论