PHP code example of popphp / pop-css

1. Go to this page and download the library: Download popphp/pop-css library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.

    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

popphp / pop-css example snippets


use Pop\Css\Css;
use Pop\Css\Selector;

$css = new Css();

$html = new Selector('html');
$html->setProperties([
    'margin'           => 0,
    'padding'          => 0,
    'background-color' => '#fff',
    'font-family'      => 'Arial, sans-serif'
]);

$login = new Selector('#login');
$login->setProperty('margin', 0)
    ->setProperty('padding', 0);

$css->addSelectors([$html, $login]);

echo $css;


$cssString = $css->render();


echo $css;


$css->writeToFile(__DIR__ . '/styles.css');


use Pop\Css\Css;
use Pop\Css\Selector;

$html = new Selector('html');
$html->setProperties([
    'margin'           => 0,
    'padding'          => 0,
    'background-color' => '#fff',
    'font-family'      => 'Arial, sans-serif'
]);

$login = new Selector('#login');
$login->setProperty('margin', 0)
    ->setProperty('padding', 0);

$css = new Css($html, $login);


use Pop\Css\Css;
use Pop\Css\Selector;

$css = new Css();

// Element selector
$html = new Selector('p');
$html->setProperties([
    'margin'      => 0,
    'padding'     => '3px',
    'color'       => '#555',
    'font-family' => 'Arial, sans-serif'
]);

// ID selector
$login = new Selector('#login');
$login->setProperty('margin', 0)
    ->setProperty('padding', 0);

// Class selector
$bold = new Selector('.bold');
$bold->setProperty('font-weight', 'bold');

$css->addSelectors([$html, $login, $bold]);

echo $css;


use Pop\Css\Css;
use Pop\Css\Selector;
use Pop\Css\Media;

$css = new Css();

$html = new Selector('html');
$html->setProperties([
    'margin'  => 0,
    'padding' => 0,
    'background-color' => '#fff',
    'font-family' => 'Arial, sans-serif'
]);

$login = new Selector('#login');
$login->setProperty('margin', 0);
$login->setProperty('padding', 0);
$login->setProperty('width', '50%');

$p = new Selector('p');
$p->setProperty('margin', 0);
$p->setProperty('padding', 0);
$p->setProperty('width', '50%');

$media = new Media('screen');
$media->setFeature('max-width', '480px');
$media['#login'] = new Selector();
$media['#login']->setProperty('width', '75%');
$media['p'] = new Selector();
$media['p']->setProperty('width', '75%');

$css->addSelectors([$html, $login, $p])
    ->addMedia($media);

echo $css;


use Pop\Css\Css;
use Pop\Css\Selector;
use Pop\Css\Media;

$css = new Css();
$css->addComment('This is a global comment');

$html = new Selector('html');
$html->setProperties([
    'margin'  => 0,
    'padding' => 0,
    'background-color' => '#fff',
    'font-family' => 'Arial, sans-serif'
]);

$p = new Selector('p');
$p->setProperty('margin', 0);
$p->setProperty('padding', 0);
$p->setProperty('width', '50%');
$p->addComment('This is a comment for the P selector');

$media = new Media('screen');
$media->setFeature('max-width', '480px');
$media['html'] = new Selector();
$media['html']->setProperty('padding', '1%');
$media['html']->addComment('This is a comment for the HTML selector in the media query');
$media->addComment('This is a comment for the media query');

$css->addSelectors([$html, $p])
    ->addMedia($media);

echo $css;


use Pop\Css\Css;
use Pop\Css\Selector;

$p = new Selector('p');
$p->setProperty('margin', 0);
$p->setProperty('padding', 0);
$p->setProperty('width', '50%');
$p->addComment('This is a comment for the P selector', 0, false);

$css = new Css($p);
echo $css;


use Pop\Css\Css;

$css = Css::parseFile('path/to/styles.css');

$css = Css::parseString($cssString);

$css = Css::parseUri('http://www.domain.com/css/styles.css');


use Pop\Css\Css;
use Pop\Css\Selector;
use Pop\Css\Media;

$css = new Css();
$css->addComment('This is a global comment');

$html = new Selector('html');
$html->setProperties([
    'margin'  => 0,
    'padding' => 0,
    'background-color' => '#fff',
    'font-family' => 'Arial, sans-serif'
]);

$p = new Selector('p');
$p->setProperty('margin', 0);
$p->setProperty('padding', 0);
$p->setProperty('width', '50%');

$media = new Media('screen');
$media->setFeature('max-width', '480px');
$media['html'] = new Selector();
$media['html']->setProperty('padding', '1%');

$css->addSelectors([$html, $p])
    ->addMedia($media);

$css->minify(true);

echo $css;