2021年9月25日
label 元素提高表单的可访问性
摘要： label 标签的文本内容通常会是表单组件的名称或标签 。 这些文本表明了组件的意义，也提升了表单的可访问性。 label 标签的 for 属性将标签与表单组件绑定；同时，屏幕阅读器也会读取 for 属性的属性值。 在 HTML 基础章节中，我们已经学习使用了单选按钮标签。 在那个挑战中，为了让标签 阅读全文
posted @ 2021-09-25 15:36 小薇的前端学习日记 阅读(70) 评论(0) 推荐(0)
animation-fill-mode
摘要： animation-fill-mode 属性规定当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。 阅读全文
posted @ 2021-09-25 15:36 小薇的前端学习日记 阅读(63) 评论(0) 推荐(0)
2021年9月24日
密码框默认文字明文显示placeholder
摘要： placeholder = “文字” value就不用写了 阅读全文
posted @ 2021-09-24 20:01 小薇的前端学习日记 阅读(61) 评论(0) 推荐(0)
linear-gradient() CSS颜色线性渐变
摘要： background: linear-gradient(gradient_direction, color 1, color 2, color 3, ...); 阅读全文
posted @ 2021-09-24 15:18 小薇的前端学习日记 阅读(52) 评论(0) 推荐(0)
text-transform 属性给文本添加大写效果
摘要： CSS 里的 text-transform 属性可以改变英文字母的大小写。 使用这个属性时，我们无需改变 HTML 元素中的文本也可以统一页面里英文的显示。 下面的表格展示了 text-transform 的不同值对文字 “Transform me” 的影响： 值结果 lowercase "tran 阅读全文
posted @ 2021-09-24 14:19 小薇的前端学习日记 阅读(182) 评论(0) 推荐(0)
box-shadow 给盒子添加阴影
摘要： box-shadow 属性用来给元素添加阴影，该属性值是由逗号分隔的一个或多个阴影列表。 box-shadow 属性的阴影依次由下面这些值描述： offset-x 阴影的水平偏移量； offset-y 阴影的垂直偏移量； blur-radius 模糊半径； spread-radius 阴影扩展半径； 阅读全文
posted @ 2021-09-24 14:13 小薇的前端学习日记 阅读(964) 评论(0) 推荐(0)
CSS - 文本左右两端对齐
摘要： text-align: justify; 可以让除最后一行之外的文字两端对齐，即每行的左右两端都紧贴行的边缘。 阅读全文
posted @ 2021-09-24 14:07 小薇的前端学习日记 阅读(819) 评论(0) 推荐(0)
2021年9月23日
给 CSS 变量设置备用值
摘要： 使用变量来作为 CSS 属性值的时候，可以设置一个备用值来防止由于某些原因导致变量不生效的情况。 注意： 备用值不是用于增强浏览器的兼容性，它也不适用于 IE 浏览器。 相反，它是用来让浏览器在找不到你的变量时可以显示一种颜色。 下面是操作方式： background: var(--penguin- 阅读全文
posted @ 2021-09-23 20:56 小薇的前端学习日记 阅读(106) 评论(0) 推荐(0)
创建一个自定义的 CSS 变量
摘要： 为创建一个 CSS 变量，你只需要在变量名前添加两个连字符号，并为其赋值即可，例子如下： --penguin-skin: gray; 这样就会创建一个 --penguin-skin 变量，它的值为 gray。 现在，其他元素可通过该变量来使元素变成灰色。 阅读全文
posted @ 2021-09-23 20:39 小薇的前端学习日记 阅读(98) 评论(0) 推荐(0)
[attr=value] 属性选择器
摘要： E[attr=value] a[href="http://www.w3school.com.cn/"][title="W3School"] {color: red;} 这会把以下标记中的第一个超链接的文本变为红色，但是第二个或第三个链接不受影响： <a href="http://www.w3scho 阅读全文
posted @ 2021-09-23 20:15 小薇的前端学习日记 阅读(133) 评论(0) 推荐(0)