Sådan benyttes komponenten CssBase klassen
Først skal du inkludere den fil der beskriver komponenten, som en klasse fil
<? require_once(HTML_PACKAGE_PATH.'/CssBase.php'); ?>
Dernæst kan du enten benytte komponenten som et taglib (statiske metoder):
<? CssBase::display($param1, $param2, $param3, ...); ?>
eller du kan lave en instance af komponenten og benytte metoderne direkte:
<? $object = new CssBase($param1, $param2, $param3, ...); print $object->getHtml(); ?>
Sådan vises komponenten CssBase klassen
Den fulde PHP kildekode for CssBase klassen
<?php/** * @package base * @see HTML_BASE_PAGE_PATH.'/CssBase.php' * @copyright (c) http://Finn-Rasmussen.com * @license http://Finn-Rasmussen.com/license/ myPHP License conditions * @author http://Finn-Rasmussen.com * @version 1.11 * @since 27-nov-2009 *//** * The required files */require_once(HTML_BASE_PAGE_PATH.'/Css.php');require_once(HTML_BASE_UTIL_PATH.'/Images.php');/** * The CSS for the Base package * Generates the Base CSS * <code> * Usage: * $href = "base.css"; * $css = new CssBase($href); * print $css->getHtml(); * Or: * CssBase::display($href); * </code> * @package base */class CssBase extends Css { /** * Constructor * @param String $href The url to the css filename (i.e. base.css) */ function __construct($href='') { parent::__construct($href != '' ? $href : CSS_FILE_NAME_BASE); } /** * Get the class for the display:none * Note: This CSS class name is used when printing * @return array The array of CSS key/value pairs */ function getPrinterStyle() { return array( CSS_NAME_STYLE_PROPERTY=>".".CSS_PRINTER, CSS_NAME_DISPLAY=>CSS_DISPLAY_NONE, ); } /** * Get the class for the printer * @return String The CSS for the printer */ function getMediaPrint() { $html = $this->getStart("@media print"); $html .= $this->getCssArray($this->getPrinterStyle()); $html .= $this->getEnd(); return $html; } /** * Returns the css Base components * @return String the complete css */ function getCustom() { $html = ''; $html .= $this->getHeader($this->getClassName()); // The html tags $html .= $this->getCssTag('body',CSS_CANVAS_COLOR,CSS_CANVAS_BACKGROUND, CSS_FONT_FAMILY, CSS_FONT_SIZE, CSS_TEXT_ALIGN_LEFT, CSS_MARGIN_TOP, CSS_MARGIN_LEFT, CSS_MARGIN_RIGHT, CSS_MARGIN_BOTTOM); // 2008-05-13 removed CSS_BODY_COLOR,CSS_BODY_BACKGROUND $html .= $this->getCssTag('h1,h2,h3,h4,h5,h6,th,td,p,b,ul,li,pre,fieldset,legend','','', CSS_FONT_FAMILY, CSS_FONT_SIZE, CSS_TEXT_ALIGN_LEFT); // Components $html .= $this->getComponent('', CSS_BODY_COLOR ,CSS_BODY_BACKGROUND); $html .= $this->getComponent('.'.CSS_COLOR_HEADER ,CSS_COLOR_HEADER_COLOR ,CSS_COLOR_HEADER_BACKGROUND); $html .= $this->getComponent('.'.CSS_COLOR_LIGHT ,CSS_COLOR_LIGHT_COLOR ,CSS_COLOR_LIGHT_BACKGROUND); $html .= $this->getComponent('.'.CSS_COLOR_DARK ,CSS_COLOR_DARK_COLOR ,CSS_COLOR_DARK_BACKGROUND); $html .= $this->getComponent('.'.CSS_LINK_COLOR ,CSS_BODY_COLOR ,CSS_BODY_BACKGROUND); $html .= $this->getComponent('.'.CSS_BODY ,CSS_BODY_COLOR ,CSS_BODY_BACKGROUND); // TODO used when maximize links are in action $html .= $this->getComponent('.'.CSS_CANVAS,CSS_BODY_COLOR,CSS_NORMAL_CANVAS); // Header, Alignment $html .= $this->getClass('.'.CSS_ARROW_HEADLINE,CSS_ARROW_HEADLINE_COLOR,CSS_ARROW_HEADLINE_BACKGROUND,CSS_ARROW_HEADLINE_WIDTH); $html .= $this->getClass('.'.CSS_ALIGN_LEFT ,'','','','left'); $html .= $this->getClass('.'.CSS_ALIGN_CENTER,'','','','center'); $html .= $this->getClass('.'.CSS_ALIGN_RIGHT ,'','','','right'); // TH should not wrap when sorting with image link $html .= $this->getSingle('.'.CSS_NO_WRAP , CSS_NAME_WHITE_SPACE, CSS_WHITE_SPACE_NOWRAP); // Legend/Fieldset TODO CSS_BORDER $html .= $this->getClass('.'.CSS_ONEPC ,'','',CSS_1PC); $html .= $this->getClass('.'.CSS_ONEPX ,'','',CSS_1PX); // Utils $html .= $this->getSingle('.'.CSS_FLOAT_LEFT, 'float', 'left'); $html .= $this->getSingle('.'.CSS_FLOAT_NONE, 'float', 'none'); $html .= $this->getSingle('.'.CSS_FLOAT_RIGHT,'float', 'right'); $html .= $this->getSingle('.xTransparent', 'background', 'transparent'); $html .= $this->getSingle('.'.CSS_HELP , CSS_NAME_CURSOR, CSS_CURSOR_HELP); $html .= $this->getHidden('.'.CSS_HIDDEN); $html .= $this->getHr(CSS_BODY_COLOR,CSS_BODY_BACKGROUND,CSS_1PX); $html .= $this->getWidth('.'.CSS_FILL_OUT ,CSS_WIDTH_FILL_OUT); // Fieldset and Legend $html .= $this->getFieldset('.'.CSS_FIELDSET); $html .= $this->getLegend('.'.CSS_LEGEND); // The css, when printing $html .= $this->getMediaPrint(); // Images $arrowBullit = new Images(IMAGE_ARROW_BULLIT); $arrowBullitDown = new Images(IMAGE_ARROW_BULLIT_DOWN); $arrowBullitSublevel = new Images(IMAGE_ARROW_BULLIT_SUBLEVEL); $arrowHeadline = new Images(IMAGE_ARROW_HEADLINE); $arrowBullitUp = new Images(IMAGE_ARROW_BULLIT_UP); // Lists $html .= $this->getLi('.AB,li' ,'circle', $arrowBullit->get('src')); $html .= $this->getLi('.ABD' ,'square', $arrowBullitDown->get('src')); $html .= $this->getLi('.ABS' ,'disc' , $arrowBullitSublevel->get('src')); $html .= $this->getLi('.AH' ,'square', $arrowHeadline->get('src')); $html .= $this->getLi('.ABU' ,'circle', $arrowBullitUp->get('src')); $html .= $this->getLi('.ABX' ,'none' ,CSS_STYLE_IMAGE_NONE); // Border / no border $html .= $this->getBorder('.'.CSS_BORDER,CSS_BORDER_COLOR,CSS_1PX); $html .= $this->getBorder('.'.CSS_NO_BORDER); $html .= $this->getClass('.'.CSS_ERROR, "f00", "ff0"); // Red/Yellow $html .= $this->getClass('.'.CSS_SELECTED, "000", "ff0"); // Red/Yellow return $html; } /** * Display html * <code> * Usage: * $href = "base.css"; * CssBase::display($href); * </code> * @static * @param String $href, The url to the css file (i.e. base.css) */ public static function display($href='') { $html = new CssBase($href); $html->addHtml(); }}?>
Den fulde HTML kildekode for CssBase klassen
<? <!-- DEBUG: CssBase --> <style type="text/css"> /*********************************************************** * * AUTOGENERATED file, DO NOT CHANGE OR EDIT, the full source code is here _____________________________________________________ ________| |________ \ | http://Finn-Rasmussen.com Phone (+45) 40 50 60 69 | / \ | Kongens Vænge 79, 3400 Hillerød, Denmark | / / |_____________________________________________________| \ /___________) (__________\ * * @version : 1.11 * @since : 24-May-2010 09:38:55 * @copyright : Copyright © 1999-2010 http://Finn-Rasmussen.com * * Email : Please, phone me for my email address * Web : http://Finn-Rasmussen.com * : This website was created by the myPHP taglib and CMS * : Download a free demo of the myPHP taglib here ... * : http://Finn-Rasmussen.com/myPHP/ * @domain : finnrasmussen.dk * @language : da * @webmaster : DEFAULT_CMS_LOGIN_USERNAME(+)finnrasmussen.dk * @file : /cache/files/finnrasmussen.dk-base.css (Autocreated cache file) * @classname : CssBase ***********************************************************/ body{ color : #000; background-color : #ddd; font-family : verdana,"lucida sans unicode",lucida,"lucida sans",sans-serif; font-size : 11px; text-align : left; margin-top : 10px; margin-left : 10px; margin-right : 10px; margin-bottom : 10px; } h1,h2,h3,h4,h5,h6,th,td,p,b,ul,li,pre,fieldset,legend{ font-family : verdana,"lucida sans unicode",lucida,"lucida sans",sans-serif; font-size : 11px; text-align : left; } a:link,a:visited,a:active{ color : #000; background-color : #fff; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover{ color : #fff; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } .baseColorHeader{ color : #000; background-color : #aaa; } a:link.baseColorHeader,a:visited.baseColorHeader,a:active.baseColorHeader{ color : #000; background-color : #aaa; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseColorHeader{ color : #aaa; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseColorHeader{ color : #aaaaab; background-color : #aaa; border-style : none; } .baseColorLight{ color : #000; background-color : #ddd; } a:link.baseColorLight,a:visited.baseColorLight,a:active.baseColorLight{ color : #000; background-color : #ddd; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseColorLight{ color : #ddd; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseColorLight{ color : #ddddde; background-color : #ddd; border-style : none; } .baseColorDark{ color : #000; background-color : #ccc; } a:link.baseColorDark,a:visited.baseColorDark,a:active.baseColorDark{ color : #000; background-color : #ccc; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseColorDark{ color : #ccc; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseColorDark{ color : #cccccd; background-color : #ccc; border-style : none; } .baseLinkColor{ color : #000; background-color : #fff; } a:link.baseLinkColor,a:visited.baseLinkColor,a:active.baseLinkColor{ color : #000; background-color : #fff; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseLinkColor{ color : #fff; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseLinkColor{ color : #fffffe; background-color : #fff; border-style : none; } .baseBody{ color : #000; background-color : #fff; } a:link.baseBody,a:visited.baseBody,a:active.baseBody{ color : #000; background-color : #fff; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseBody{ color : #fff; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseBody{ color : #fffffe; background-color : #fff; border-style : none; } .baseCanvas{ color : #000; background-color : #ddd; } a:link.baseCanvas,a:visited.baseCanvas,a:active.baseCanvas{ color : #000; background-color : #ddd; font-size : 11px; font-weight : bold; text-decoration : underline; } a:hover.baseCanvas{ color : #ddd; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : underline; } img.baseCanvas{ color : #ddddde; background-color : #ddd; border-style : none; } .baseArrowHeader{ color : #000; background-color : #f00; width : 1%; } .baseAlignLeft{ text-align : left; } .baseAlignCenter{ text-align : center; } .baseAlignRight{ text-align : right; } .baseNoWrap{ white-space : nowrap; } .baseOnepc{ width : 1%; } .baseOnepx{ width : 1px; } .baseFloatLeft{ float : left; } .baseFloatNone{ float : none; } .baseFloatRight{ float : right; } .xTransparent{ background : transparent; } .baseHelp{ cursor : help; } .baseHidden{ position : relative; z-index : -1; visibility : hidden; } hr{ color : #000; background-color : #fff; height : 1px; } .baseFillOut{ width : 100%; } .baseFieldset{ border : #000 1px solid; border-top-color : #000; border-top-width : 1px; border-top-style : solid; border-left-color : #000; border-left-width : 1px; border-left-style : solid; border-right-color : #000; border-right-width : 1px; border-right-style : solid; border-bottom-color : #000; border-bottom-width : 1px; border-bottom-style : solid; padding : 2px 8px; } .baseLegend{ padding : 2px; border : #000 1px solid; border-top-color : #000; border-top-width : 1px; border-top-style : solid; border-left-color : #000; border-left-width : 1px; border-left-style : solid; border-right-color : #000; border-right-width : 1px; border-right-style : solid; border-bottom-color : #000; border-bottom-width : 1px; border-bottom-style : solid; } @media print{ .basePrinter{ display : none; } } .AB,li{ list-style-type : circle; list-style-image : url('http://finnrasmussen.dk/images/arrow-bullit.gif'); } .ABD{ list-style-type : square; list-style-image : url('http://finnrasmussen.dk/images/arrow-bullit-down.gif'); } .ABS{ list-style-type : disc; list-style-image : url('http://finnrasmussen.dk/images/arrow-bullit-sublevel.gif'); } .AH{ list-style-type : square; list-style-image : url('http://finnrasmussen.dk/images/arrow-headline.gif'); } .ABU{ list-style-type : circle; list-style-image : url('http://finnrasmussen.dk/images/arrow-bullit-up.gif'); } .ABX{ list-style-type : none; list-style-image : none; } .baseBorder{ border : #000 1px solid; border-top-color : #000; border-top-width : 1px; border-top-style : solid; border-left-color : #000; border-left-width : 1px; border-left-style : solid; border-right-color : #000; border-right-width : 1px; border-right-style : solid; border-bottom-color : #000; border-bottom-width : 1px; border-bottom-style : solid; } .baseNoBorder{ border : #000 0px solid; border-top-color : #000; border-top-width : 0px; border-top-style : solid; border-left-color : #000; border-left-width : 0px; border-left-style : solid; border-right-color : #000; border-right-width : 0px; border-right-style : solid; border-bottom-color : #000; border-bottom-width : 0px; border-bottom-style : solid; } .baseError{ color : #f00; background-color : #ff0; } .baseSelected{ color : #000; background-color : #ff0; } /* DEBUG, Not cached, CSS Custom file : /cache/css/finnrasmussen.dk-base.css */ </style> ?>
Her er 'klasse metoderne' for CssBase klassen:
Her er 'objekt variable' for CssBase klassen: