Search results

Getting Started

This section briefly explains about how to include a simple Card in your ASP.NET MVC application. You can refer ASP.NET MVC Getting Started documentation page for introduction part of the system requirements and configure the common specifications.

Adding a simple Card

  • Add the HTML div element with e-card class into your sample file.
        <div class = "e-card">
          Sample Card
        </div>

Adding a header and content

You can create Card with a header in a specific structure. For adding header you need to create a div element with e-card-header class added.

  • You can include heading inside the Card header by adding a div element with e-card-header-caption class, and also content will be added by adding element with e-card-content. For detailed information, refer to the Header and Content.
    <div class = "e-card">                    --> Root Element
        <div class="e-card-header">           --> Root Header Element
            <div class="e-card-header-caption">    --> Root Heading Element
                <div class="e-card-header-title"></div>   --> Heading Title Element
            </div>
            <div class="e-card-content"></div>         --> Card content Element
        </div>
    </div>
razor
controller.cs
/*Razor CodeBlock*/
        
        <div tabindex="0" class="e-card" id="basic">
            <div class="e-card-header">
                <div class="e-card-header-caption">
                    <div class="e-card-header-title">Advanced UWP</div>
                </div>
            </div>
            <div class="e-card-content">
                Advanced UWP: Communicating with Windows 10 and Other Apps, the second in a five-part series written by Succinctly series
                author Matteo Pagani. To download the complete white paper, and other papers in the series, visit
                the White Paper section of Syncfusion’s Technology Resource Portal.
            </div>
        </div>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace WebApplication.Controllers
{
    public partial class CardController : Controller
    {
        public IActionResult htmldom()
        {
            return View();
        }
    }
}

See Also