{"id":13486315,"url":"https://github.com/chokcoco/magicCss","last_synced_at":"2025-03-27T20:32:47.294Z","repository":{"id":44847944,"uuid":"59204524","full_name":"chokcoco/magicCss","owner":"chokcoco","description":"CSS3奇思妙想，单标签实现各类图形","archived":false,"fork":false,"pushed_at":"2020-02-08T15:13:00.000Z","size":330,"stargazers_count":1439,"open_issues_count":4,"forks_count":289,"subscribers_count":57,"default_branch":"master","last_synced_at":"2024-10-29T20:33:30.840Z","etag":null,"topics":["css3","pesudo"],"latest_commit_sha":null,"homepage":"https://chokcoco.github.io/magicCss/html/index.html","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chokcoco.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-19T12:32:09.000Z","updated_at":"2024-10-11T07:55:49.000Z","dependencies_parsed_at":"2022-08-27T07:41:29.393Z","dependency_job_id":null,"html_url":"https://github.com/chokcoco/magicCss","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chokcoco%2FmagicCss","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chokcoco%2FmagicCss/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chokcoco%2FmagicCss/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chokcoco%2FmagicCss/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chokcoco","download_url":"https://codeload.github.com/chokcoco/magicCss/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":222313900,"owners_count":16965407,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css3","pesudo"],"created_at":"2024-07-31T18:00:43.954Z","updated_at":"2024-10-30T21:31:25.656Z","avatar_url":"https://github.com/chokcoco.png","language":"HTML","readme":"# magicCss \n\n`CSS3` 奇思妙想，使用 `CSS3` 在单个标签内实现各类图形。\n\n除去一些需要背景衬托的图形，本项目中所有图形均为单标签图形，即使用一个标签完成整个图案。\n\n| Demo链接 | Description |\n| ------| ------ | \n| [CSS3奇思妙想](https://chokcoco.github.io/magicCss/html/index.html) | CSS3奇思妙想，单标签实现各类图形 |\n| [SVG奇思妙想](https://chokcoco.github.io/demo/svg/html/index.html)  | 使用 `SVG` or `clip-path` 创建的图形 | \n\n## 由来\n\n拜读了 [《CSS Secret》](https://github.com/cssmagic/CSS-Secrets) 这本大作之后，有了这个项目的想法。其中带星号的图形为书中出现过的实例。\n\n大量使用了 `::before` 、`::after` 伪元素，`transparent`、`border` ，多重线性与径向渐变，多重内外阴影，实现了许多奇妙的图形。\n\n很多例子参照了书中得来，也有许多我工作中实践积攒而来的。\n\n\n## Contact\n\n如果有任何问题或者疑问，可以加 QQ 群：418766876 。也欢迎想讨论各种天马行空的 CSS 相关问题的小伙伴们加入。\n\n![qqqun](https://github.com/chokcoco/iCSS/blob/master/qqqun.png)\n","funding_links":[],"categories":["编程"],"sub_categories":["CSS"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchokcoco%2FmagicCss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchokcoco%2FmagicCss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchokcoco%2FmagicCss/lists"}