CSS Media Query Snippets 1.0.1
CSSMediaQuerySnippets扩展是为响应式设计提供便利的工具,它帮助您快速编写适用于不同设备尺寸的媒体查询。此扩展采用Bootstrap4的断点系统,确保您的设计在各种设备上都能完美呈现。主要特点:Bootstrap4断点支持:扩展基于Bootstrap4的响应式断点,详细信息请见Bootstrap4官方文档。多文件格式支持:适用于.css、.scss和.sass文件,
功能介绍
CSS Media Query Snippets扩展是为响应式设计提供便利的工具,它帮助您快速编写适用于不同设备尺寸的媒体查询。此扩展采用Bootstrap 4的断点系统,确保您的设计在各种设备上都能完美呈现。
主要特点:
- Bootstrap 4断点支持:扩展基于Bootstrap 4的响应式断点,详细信息请见Bootstrap 4官方文档。
- 多文件格式支持:适用于.css、.scss和.sass文件,满足不同开发需求。
- 便捷的使用方式:每个snippet前缀由三部分组成——屏幕尺寸、范围和类型,简化了媒体查询的编写过程。
使用指南:
每个snippet前缀包含以下三部分:
屏幕尺寸:
- 超小型(extra-small)
- 小型(small)
- 中型(medium)
- 大型(large)
- 超大型(extra-large)
范围:
- 仅限选定屏幕尺寸(-only)
- 选定屏幕尺寸及更大(-and-up)
- 选定屏幕尺寸及更小(-and-down)
类型:
- 媒体查询(-media-query)
常用snippet示例:
前缀 | 结果 |
---|---|
small-devices-and-up-media-query | 小型设备及更大(横向手机,576px及以上) |
medium-devices-and-up-media-query | 中型设备及更大(平板电脑,768px及以上) |
large-devices-and-up-media-query | 大型设备及更大(桌面电脑,992px及以上) |
small-devices-and-down-media-query | 小型设备(横向手机,低于768px) |
medium-devices-and-down-media-query | 中型设备(平板电脑,低于992px) |
large-devices-and-down-media-query | 大型设备(笔记本电脑,桌面电脑,低于1200px) |
extra-small-devices-only-media-query | 仅超小型设备(纵向手机,低于576px) |
small-devices-only-media-query | 仅小型设备(横向手机,576px至767px之间) |
medium-devices-only-media-query | 仅中型设备(笔记本电脑,桌面电脑,768px至991px之间) |
large-devices-only-media-query | 仅大型设备(笔记本电脑,桌面电脑,992px至1199px之间) |
extra-large-devices-only-media-query | 仅超大型设备(桌面电脑,1200px及以上) |
已知问题:
目前没有已知问题。
发布说明:
- 1.0.0版本:首次发布,添加了媒体查询snippet。
CSS Media Query Snippets扩展为您的响应式设计提供了强大的支持,帮助您更高效地处理不同设备尺寸的布局调整。
版本声明
本文转载于:https://marketplace.visualstudio.com/items?itemName=AjithGopi.css-snippets 如有侵犯,请联系study_golang@163.com删除
更多
相关下载
查看更多
课程推荐
-
- Golang云原生架构师课程
- Go是一门并发支持、垃圾回收的编译型系统编程语言;本课程转载自哔哩哔哩:https://www.bilibili.com/video/BV1Mh411M7A
- 204次学习
-
- MySQL数据管理之备份恢复案例解析视频教程
- 《MySQL数据管理之备份恢复案例解析视频教程》MySQL是一个开放源码的小型关联式数据库管理系统,目前MySQL被广泛地应用在Internet上的中小型网站中。由于其体积小、速度快、总体拥有成本低,尤其是开放源码这一特点,许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库。
- 160次学习
-
- MySQL索引优化解决方案
- 本套课程是根据MySQL索引的设计理念与数据结构、索引使用场景、索引分类、索引运用场景、索引性能分析、查询优化、MySQL索引的慢查询等组成,主要讲述了MySQL索引优化的解决方案,非常适合有MySQL使用基础或者有一定工作经验的同学。课程讲解了解决大数量查询慢的问题、如何编写一个高效的SQL、查询语句应该如何优化、索引的实现原理是什么、索引又应该如何优化...等诸多SQL索引优化的难点和面试点。
- 182次学习
-
- 极客学院Docker视频教程
- Docker是PaaS提供商dotCloud开源的一个基于LXC的高级容器引擎,源代码托管在Github上,基于go语言并遵从Apache2.0协议开源。Docker自2013年以来非常火热,无论是从github上的代码活跃度,还是各大厂商的支持,都使Docker成为了时下最受关注的技术,甚至微软都声称在下一代WindowsServer中集成对Docker的支持。所以我们收集了《极客学院Docke
- 243次学习
-
- Golang进阶实战编程
- 本课程是在《Go语言基础视频》基础之上录制的,是Go语言基础的后半部分。包括包的管理,IO操作,Go语言最大的亮点:高并发,goroutine,channel,反射等。本视频主要为了帮助Go语言的初学者,从零到一的快速入门。学完本套课程,可以学会如果通过包管理Go项目,并发模型,以及并发实现,channel通道如何传递数据,反射等等。
- 127次学习
-
- JavaScript极速入门
- 本套课程将帮助大家迅速掌握JavaScript这门高端的、动态的、弱类型编程语言。知识点简单明了,让你学习0压力,适合新手观看学习......
- 431次学习
查看更多
相关文章
-
- Golangmap实践及实现原理解析
- 2022-12-28 505浏览
-
- GoLand调式动态执行代码
- 2023-01-13 502浏览
-
- 试了下Golang实现try catch的方法
- 2022-12-27 502浏览
-
- 用Nginx反向代理部署go写的网站。
- 2023-01-17 502浏览
-
- MySQL主从切换的超详细步骤
- 2023-01-01 501浏览
-
- Mysql-普通索引的 change buffer
- 2023-01-25 501浏览