README

CSS工具

CSS中的另一个CSS工具。

这是一个将CSS代码解析为关联数组的CSS优化器。
您可以使用PHP操作CSS，执行优化的魔法，并以文本形式输出结果或将结果保存到文件中。

优化

• 压缩CSS：替换多个空格、换行符和最后的分号
• 优化值：在不必要时删除零（0.3s -> .3s）
• RGB转HEX：颜色rgb转hex（rgb(255,255,255) -> #fff）
• HSL转HEX：颜色hls转hex（hsl(236, 0%, 0%) -> #000）
• 优化HEX：简化十六进制（#ffcc00 -> #fc0）
• 提高兼容性：添加前缀（-webkit-、-moz-、-ms-和-o-）
• 优化语法：简写属性

安装

您可以通过Composer使用以下命令进行安装：

composer require csstool/css --prefer-dist

或者您可以直接从github.com下载文件，并自行包含/src/文件夹中的文件。

用法

您可以使用CSS工具优化一个或多个CSS文件，以文本形式输出或将结果保存到文件中。

<?php
// Include the autoloader or the classes files
require 'vendor/autoload.php';

// Declare the use of CSSTool
use CSSTool;

// Create an instanece of CSSTool\CSS class
$CSS = new CSS;

// Load the initial CSS from a file
$CSS->load('assets/css/css1.css');

// Load another CSS file, appending to the previous CSS
$CSS->load('assets/css/css2.css');

// Saves the final merged and optimized CSS into a file
if($CSS->save('assets/css/optimized.min.css')){
  echo 'Saved with sucess!';
} else {
  echo 'Something went wrong...';
}

当然，您还可以做更多的事情，只需查看公开的方法，您就会看到CSS工具可以做更多的事情。如果您有一个涉及使用PHP操作CSS的任务，或者只是压缩和优化CSS，这就是它。

方法

以下为公开方法

方法 set($cssInput)

$cssInput：字符串或数组

用于设置初始CSS。它可以与解析后的CSS数组或字符串形式的CSS代码一起使用，它不会追加，而是替换实际数据。

您可以使用set()方法与字符串一起使用，这个字符串可以来自文件或其他。

<?php
$CSS = new CSSTool\CSS;

// Set an initial CSS from string
$CSS->set('body{color:#333}');

echo $CSS->get('string');

输出

body{color:#333}

或者，如果您有一组以关联数组形式结构化的规则，您也可以使用它

<?php
$CSS = new CSSTool\CSS;

// Set an initial CSS from array
$rule = array( 
    'body' => array('color' => '#333')
);
$CSS->set($rule);
echo $CSS->get('string');

将输出

body{color:#333}

方法 load($cssFilepath)

$cssFilepath：字符串，包含本地路径或CSS文件的远程URL

用于从文件加载CSS。随后加载的文件将被追加到对象中已有的CSS。

从本地路径加载CSS文件

<?php
$CSS = new CSSTool\CSS;

// Load CSS from a file
$CSS->load('tests/example.css');

echo $CSS->get('string');

输出

body{color:#333}

从URL加载CSS文件

<?php
$CSS = new CSSTool\CSS;

// Load CSS from a file
$CSS->load('https:///tests/example.css');

echo $CSS->get('string');

输出

body{color:#333}

方法 save($cssFilepath)

$cssFilepath：字符串，包含输出文件的路径名

用于将CSS对象中定义的CSS保存到文件中。

保存到文件

<?php
$CSS = new CSSTool\CSS;

$CSS->set('body{color:#333}');
// Create a optimized file
if($CSS->save('tests/css/example-min.css')){
  echo 'File created with success';
} else {
  echo 'Something went wrong...';
}

方法 parse($cssStringInput)

$cssStringInput：字符串

用于获取以字符串形式解析的CSS，并将其转换为关联数组中的一组规则，以便稍后进行操作和追加或插入到CSS中。

解析示例

<?php
$CSS = new CSSTool\CSS;

// string with CSS
$stringCSS = 'body {color:red;} p {margin:0}';

// Array with parsed CSS
$parsedCSS = $CSS->parse($stringCSS);

var_dump($parsedCSS);

输出

array(2) {
  [0]=>
  array(1) {
    ["body"]=>
    array(1) {
      ["color"]=>
      string(3) "red"
    },
  [1]=>
  array(1) {
    ["p"]=>
    array(1) {
      ["margin"]=>
      string(1) "0"
    }
  }

方法 append($cssInput)

$cssInput：字符串或数组

用于在CSS末尾添加CSS规则

<?php
$CSS = new CSSTool\CSS;

// Set initial CSS 
$CSS->set('body{color:#333333;}');

// Add rule to the end of the CSS
$CSS->append(array(
    'p' => array('color'=>'#222222'),
));

echo $CSS->get('string');

输出

body{color:#333}p{color:#222}

方法 prepend($cssInput)

$cssInput：字符串或数组

用于在CSS开头添加CSS规则

<?php
$CSS = new CSSTool\CSS;

// Set initial CSS 
$CSS->set('body{color:#333333;}');

// Add rule to the beginning of the CSS
$CSS->prepend(array(
    'p' => array('color'=>'#222222'),
));

echo $CSS->get('string');

输出

p{color:#222}body{color:#333}

方法 get($format='array',$minified=true)

$format：'array'、'string'或'json' $minified：true或false

它用于以指定的格式获取CSS。在数组格式中，$minified 属性没有作用。

get() 参数的默认值是 'array'，所以返回值将是一组关联数组

<?php
$CSS = new CSSTool\CSS;

$CSS->load('tests/example.css');

// Output as an array
echo $CSS->get();

输出

array(1) {
  [0]=>
  array(1) {
    ["body"]=>
    array(1) {
      ["color"]=>
      string(4) "#333"
    }
  }

<?php
$CSS = new CSSTool\CSS;

$CSS->load('tests/example.css');

// Output as a string
echo $CSS->get('string');

输出

body{color:#333}

<?php
$CSS = new CSSTool\CSS;

$CSS->load('tests/example.css');

// Output a non minified string
echo $CSS->get('string', false);

输出

body{
  color:#333
}

您还可以使用 *$format* 作为 'json'，但我相信您已经明白了。

配置

• autoprefixer: （默认：true） - 自动为需要添加浏览器前缀的指定属性添加前缀

示例

.example {
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
}

• optimize: （默认：true） - 优化CSS的值和属性

未优化的值示例

body {
    margin: 1.050px;
    transition: 0.3s;
    padding: 0px;
    color: rgb(255,0,0);
}

优化后

body {
    margin: 1.05px;   /* Not needed zero removed from the end        */
    transition: .3s;  /* Not needed zero removed from the beggining  */
    padding: 0;       /* Zero is always zero :D                      */
    color: #f00;      /* Color rgb to hex and hex abbreviation.      */
}

如果出于任何原因需要禁用autoprefixer或优化，您可以

<?php
// Constructor receives the configs
$CSS = new CSSTool\CSS(['autoprefixer'=>false]); 

工具

• CSS - 操作和优化CSS
• Filer - 读取、创建和删除文件
• Parser - 将CSS字符串解析为解析后的CSS数组
• Optimizer - 优化解析后的CSS的属性和值
• Minifier - 压缩CSS输出
  
  

运行测试

它们位于 /tests/ 文件夹中。您可以通过网络浏览器或使用命令行运行它们。

要通过浏览器运行，您需要导航到 domain.com/tests/ :D

要使用命令行，您需要安装PHP并执行文件 show_source.php，传递参数 f=filename.php。

示例

php show_source.php f=filename.php

嗨，我叫Igor Faria :D