
CSS样式表
文章平均质量分 80
CSS样式表相关学习
笑虾
一壶泪,暗淡醇香味。
化作万樽与谁对?
忧举杯,乐举杯,地老天荒只一醉。
欲哭时,男儿无泪,千般相思苦。
杯中汇……
展开
-
微信小程序 width 100% 加 margin 或 padding 溢出屏幕
【代码】微信小程序 width 100% 加 margin 或 padding 溢出屏幕。原创 2023-08-03 11:19:53 · 1891 阅读 · 0 评论 -
querySelector 和 querySelectorAll 学习笔记
简介按照CSS选择器匹配元素,关于选择器这篇笔记有详细介绍:CSS 学习笔记 - 选择器方法区别支持querySelector返回第一个匹配的元素Element, DocumentquerySelectorAll返回所有匹配的元素Element, DocumentpreviousElementSibling返回当前元素的前一个元素。如果当前就是第一个元素返回nullnextElementSibling返回当前元素的下一个元素。如果当前就是最后一个元素返回n原创 2020-12-06 15:25:36 · 590 阅读 · 0 评论 -
CSS 学习笔记 - 网格布局(栅格系统)
CSS 学习笔记 - 网格布局(栅格系统)开启网格模式名词解释属性说明容器属性内容元素属性效果展示参考资料网格布局(栅格系统)官方解释:CSS 网格布局擅长于将一个页面划分为几个主要区域,以及定义这些区域的大小、位置、层次等关系(前提是HTML生成了这些区域)。像表格一样,网格布局让我们能够按行或列来对齐元素。 然而在布局上,网格比表格更可能做到或更简单。 例如,网格容器的子元素可以自己定位,以便它们像CSS定位的元素一样,真正的有重叠和层次。个人理解:要说这个栅格系统玩过地图编辑器的同学原创 2020-10-06 18:51:31 · 4304 阅读 · 0 评论 -
CSDN MarkDown学习笔记
本文探讨了如何在CSDN的Markdown中设置表格列宽,提供了两种非完美解决方案:1) 插入横线填充,通过在表格末尾添加一行并使用字符撑开列宽;2) 插入实体空格,通过在表头文字中插入空格来撑宽。文章还介绍了一种完美解决方案,即结合横线和实体空格在表头操作,避免自动换行。最后,提供了设置字体颜色、背景色和在线生成Markdown表格的参考资料。原创 2020-10-06 11:33:52 · 880 阅读 · 1 评论 -
CSS 学习笔记 - 水平垂直居中
<article> <section id="p1"> <div id="c1">c1</div> </section> <section id="p2"> <div id="c2">c2</div> </section> <section id="p3"> <div id="c3">c3</div> </section> <sec原创 2020-09-26 17:20:23 · 252 阅读 · 0 评论 -
CSS 学习笔记 - 浮动
CSS 学习笔记 - 定位浮动浮动类型清除浮动clear 属性after 伪类overflow 属性BFC块格式化上下文参考资料浮动{ float: left | right | none | inline-start | inline-end;}设置浮动后元素脱离文档流,并变为块级元素。允许文本和内联元素环绕它。left | rigth 设置浮动元素在容器中的停靠方向 。同一浮动方向的元素可排列停靠(类似于在它们在一个单独的文档流中)。浮动边界在父元素的padding内浮动类型原创 2020-09-13 19:01:28 · 389 阅读 · 0 评论 -
CSS 学习笔记 - 弹性布局
CSS 学习笔记 - 弹性布局参考资料ul{ display: flex; justify-content: space-between;}li{ flex: auto;}属性用于说明justify-content容器分配顺着弹性容器主轴(或者网格行轴) 的元素之间及其周围的空间flex-direction容器内部元素是如何在 flex 容器中布局的,定义了主轴的方向(正方向或反方向)flex-wrap容器指定 flex 元素单行显示还是多行显原创 2020-09-03 22:10:14 · 685 阅读 · 1 评论 -
CSS 学习笔记 - 值和单位
CSS 学习笔记 - 值和单位参考资料参考资料CSS values and units原创 2020-09-03 20:41:40 · 200 阅读 · 0 评论 -
CSS 学习笔记 - 形状/环绕
CSS 学习笔记 - 形状形状参考资料形状clip-path 矢量形状shape-outside 定义外边,控制文字环绕。支持带透明的PNG。参考资料MDN:CSS_Shapes 形状MDN:CSS_Masking 遮罩原创 2020-09-03 19:17:58 · 376 阅读 · 0 评论 -
CSS 学习笔记 - 定位
CSS 学习笔记 - 定位position定位类型清除浮动父元素自动高度参考资料position定位类型清除浮动父元素自动高度子元素浮动后,父元素自动撑起高度的各种方法:通过在子元素末尾加一个不可见的子元素,将其清除浮动,实现撑高父元素。通过伪类实现末尾添加一个元素。触发BFC比如 overflow : hidden参考资料MDN:CSS_定位_Positioning...原创 2020-09-03 19:15:39 · 278 阅读 · 1 评论 -
CSS 学习笔记 - 盒模型
CSS学习笔记 - 背景边框背景backgroundbackground-image 背景图边框borderborder-image-source 边框图片参考资料背景background支持纯色、渐变、图片background-image 背景图支持多张1.1. 用逗号分隔。先上后下1.2. 相应控制属性也一样用逗号分隔。支持各种填充方式边框borderborder-image-source 边框图片参考资料MDN:CSS_背景、边框官方页面上有个推荐的样式生成器..原创 2020-09-03 19:10:01 · 288 阅读 · 1 评论 -
CSS 学习笔记 - 选择器
CSS 学习笔记选择器伪类选择器:nth-child(an+b):nth-of-type(an+b)an+b 常用举例参考资料CSS 的细节太多,只作解惑,不搬文档。选择器伪类选择器伪类一般跟在其它选择器后,是对前者的补充描述。:nth-child(an+b)在兄弟元素中匹配,但效果只应用在当前元素上。(计算索引时把兄弟都算上了,应用样式时只顾自己)1.1. <p> 和 <h1> 一起有Bug。可以用 :nth-of-type() 解决。a,b常量整数。n从0开始原创 2020-08-30 21:41:59 · 558 阅读 · 1 评论