ycss 第一版发布

栏目: 软件资讯 · 发布时间: 5年前

内容简介:ycss 第一版发布 ycss可以做什么? 你只需要写 class 名字就可以自动帮你处理生成 css! 特性: 1.灵活配置,配置后就生效。 2.规则配置灵活,如果配置得好,可以当作框架使用。 github地址,后续迁移到 gitee 上 ...

ycss 第一版发布

ycss可以做什么?

你只需要写 class 名字就可以自动帮你处理生成 css!

特性:

1.灵活配置,配置后就生效。

2.规则配置灵活,如果配置得好,可以当作框架使用。

github地址,后续迁移到 gitee 上

例子:

<template>
    <div class="bc-ff1123"></div>
    <div class="bc-000-112-231 br-nr bp-c bs-c bs-10-15"></div>
    <div class="b-1-001 br-1-123 o-1-000121 c-fff ls-12 lh-20"></div>
    <div class="ta-c ta-r ta-l"></div>
    <div class="fs-20 fw-100"></div>
    <div class="m-1010 p-0505 h-10 w-20 h10 w10"></div>
    <div class="maxh-23 maxw-10 minh-10 minw-22"></div>
    <div class="p-f p-a p-r d-b t-2 b-1 l-3 r-40 va-m zi-205"></div>
    <div class="mt-10 ml-10 mr-10 mb-10"></div>
    <div class="pt-10 pl-10 pr-10 pb-10 br-1"></div>
    <div class="d-f fd-r ai-c jc-c ai-c fw-nw f-21 test1"></div>
</template>
<style>
    .test{
        width: 10px;
    }
    /* Automatic generation Start */
.bc-ff1123{background-color:#ff1123;}
.bc-000-112-231{background-color:rgb(000,112,231);}
.br-nr{background-repeat:no-repeat;}
.bp-c{background-position:center;}
.bs-c{background-size:cover;}
.bs-10-15{background-size:20px 30px;}
.b-1-001{border:2px solid #001;}
.br-1-123{border-right:2px solid #123;}
.o-1-000121{outline:#000121 dotted 2px;}
.c-fff{color:#fff;}
.ls-12{letter-spacing:24px;}
.lh-20{line-height:40px;}
.ta-c{text-align:center;}
.ta-r{text-align:right;}
.ta-l{text-align:left;}
.fs-20{font-size:40px;}
.fw-100{font-weight:100;}
.m-1010{margin:20px 20px;}
.p-0505{padding:10px 10px;}
.h-10{height:20px;}
.w-20{width:40px;}
.h10{height:10%;}
.w10{width:10%;}
.maxh-23{max-height:46px;}
.maxw-10{max-width:20px;}
.minh-10{min-height:20px;}
.minw-22{min-width:44px;}
.p-f{position:fixed;}
.p-a{position:absolute;}
.p-r{position:relative;}
.d-b{display:block;}
.t-2{top:4px;}
.b-1{bottom:2px;}
.l-3{left:6px;}
.r-40{right:80px;}
.va-m{vertical-align:middle;}
.zi-205{z-index:205;}
.mt-10{margin-top:20px;}
.ml-10{margin-left:20px;}
.mr-10{margin-right:20px;}
.mb-10{margin-bottom:20px;}
.pt-10{padding-top:20px;}
.pl-10{padding-left:20px;}
.pr-10{padding-right:20px;}
.pb-10{padding-bottom:20px;}
.br-1{border-radius:2px;}
.d-f{display: -webkit-flex;
    display: flex;}
.fd-r{flex-direction:row;}
.ai-c{align-items:center;}
.jc-c{justify-content:center;}
.fw-nw{flex-wrap:nowrap;}
.f-11{flex:11;}
/* Automatic generation End */
</style>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

大象无形:虚幻引擎程序设计浅析

大象无形:虚幻引擎程序设计浅析

罗丁力、张三 / 电子工业出版社 / 2017-4 / 65

《大象无形:虚幻引擎程序设计浅析》以两位作者本人在使用虚幻引擎过程中的实际经历为参考,包括三大部分:使用C++语言进行游戏性编程、了解虚幻引擎本身底层结构与渲染结构、编写插件扩展虚幻引擎。提供了不同于官方文档内容的虚幻引擎相关细节和有效实践。有助于读者一窥虚幻引擎本身设计的精妙之处,并能学习到定制虚幻引擎所需的基础知识,实现对其的按需定制。 《大象无形:虚幻引擎程序设计浅析》适合初步了解虚幻......一起来看看 《大象无形:虚幻引擎程序设计浅析》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具