Crafter.CppDOM/examples/StyleExample/README.md
2025-11-10 22:08:08 +01:00

1.4 KiB

StyleExample

This example demonstrates how to apply styling to HTML elements using Crafter.CppDOM.

Features

  • Shows how to apply inline styles using CSS strings
  • Demonstrates setting individual CSS properties
  • Illustrates working with CSS classes (adding, removing, toggling)
  • Shows how to check for class existence

Usage

import Crafter.CppDOM;
using namespace Crafter::CppDOM;

int main(){
    HtmlElement body("body","<div id=\"myDiv\"></div>");
    // Create a div element
    HtmlElement div("myDiv");
    
    // Set some initial content
    div.SetInnerHTML("<p>This is a styled paragraph</p>");
    
    // Apply styles using different methods
    div.SetStyle("color: blue; font-size: 20px; background-color: lightgray;");
    
    // Or apply individual properties
    div.SetProperty("border", "2px solid red");
    div.SetProperty("padding", "10px");
    
    // Add CSS classes
    div.AddClass("highlight");
    div.AddClass("container");
    
    // Demonstrate class toggling
    div.ToggleClass("active");
    
    // Check if class exists
    bool hasActiveClass = div.HasClass("active");
    
    // Remove a class
    div.RemoveClass("highlight");
}

Building and Running

crafter-build build executable
run.sh

Then navigate to http://localhost:8080/ in your browser.

If caddy is not installed, you can use your favorite static file server instead.