CSS Editor tools are available in all editions of PhpED. Logical addition to the most powerful PHP Tools CSS editing is one of the elements of PhpED Web development toolkit, such as WYSIWYG features for HTML elements and tags, full support for Dynamic Syntax Highlighting , Multiple Language Syntax Highlighting of PHP and HTML and other languages.
There are also specific features designed to provide for the most productive CSS Editing.
CSS Code tree in Code Navigator
CSS Code Navigator provides the way to navigate through PHP, JavaScript, HTML and CSS code easily. You can select CSS tab to see the display of the entire tree of CSS styles, classes and elements of your document and their properties. Clicking on each element will place the cursor on that element in the source. Learn more about CSS Code Navigator
CSS Preview tab
When you are working on a CSS file in the Editor you don't need to wait for anything to see the results of your work - just select CSS Preview tab of the editor and see how the CSS styles will be rendered in the browser. For example, see how the styles from one file are displayed in preview.
Note that you can select external HTML file to preview the appearance of CSS elements and styles
|
|
|
CSS Split Preview
CSS Split Preview button provides the ways to see the display of your Cascading Style Sheets and the effect of you editing of CSS source immediately at run time. CSS Split Preview button is located in the gutters of the editor. When CSS Split Preview is selected the Editor window gets split and the bottom part displays the CSS file. The changes made to the source in the top window are immediately reflected in the display (you can set the Delay for the update of the display in Tools->Settings->Code Insight Settings):
|
|
|
CSS code completion and code folding
CSS Code Completion in PhpED is working for you whether you are editing PHP, HTML or CSS code. Code hints are provided for both style properties and their allowed values. Other great PHP and HTML Editor features are PHP Code Folding and CSS Code Folding. Please see the illustrations of CSS Code completion and Code folding on the screenshot.
Once you type the beginning of any CSS property or attribute, the editor provides the list of appropriate CSS hints:
|
|
|
CSS Code Folding settings
The settings of CSS Code Folding can be configured. As described in PHP Code folding you can set the color, the shape and the placement of the folding marks as well as many other elements. To modify CSS Code Folding you should Select Tools->Settings->Editor->Code Folding, adjust the settings for Code Folding Settings using appropriate controls.
The full array of PHP, HTML and CSS tools can be configured and customized to your liking under Tools->Settings menu of NuSphere's PhpED. You can learn more about PHP Tools and download free trial of PHP IDE
|