文件名称：单一价格网格组件：FrontendMentor.io提出的新手布局挑战，以构建定价组件
文件大小：100KB
文件格式：ZIP
更新时间：2024-03-01 00:23:40
SCSS
单一价格成分 :movie_camera: 预览网站→ 对于这个项目，我使用了： HTML语义元素； 仅适用于屏幕阅读器用户的不可见内容； BEM命名； 卡覆盖的伪元素； SASS; 网格和Flex-Box； 移动优先； 后轮驱动; 附加效果： 卡覆盖颜色（第三张卡）； 按钮变换：在鼠标悬停时将其向上移动，在单击时（活动状态）将其向下移动，并更改背景颜色； 页脚中的样式链接：添加了漂亮的颜色来标记这些链接和浅灰色下划线，链接的浅背景色以及悬停时的蓝色边框颜色。 建筑项目-相关结论： 由于这一挑战，我阅读了有关有序列表的信息，特别是在Safari浏览器和可访问性方面。 当list-style属性设置为none（删除点）时，VoiceOver不会正确宣布无序列表。 因此，我可以添加ARIA角色列表和listitem来恢复语义，这有助于在VoiceOver中标识项目列表并返回列
【文件预览】：
single-price-grid-component-gh-pages
----.gitignore(421B)
----images()
--------favicon-32x32.png(1KB)
----css()
--------main.css(6KB)
--------main.scss(5KB)
--------main.css.map(5KB)
----README.md(1KB)
----index.html(3KB)
----design()
--------desktop-design.jpg(39KB)
--------desktop-preview.jpg(35KB)
--------mobile-design.jpg(32KB)
----.vscode()
--------settings.json(38B)