+++ title = "Card" description = "Display a bordered container with title area." categories = ["experience"] tags = [] html_attributes = [] custom_attributes = ["header", "text"] snippets_used = ["card", "external", "button"] copyright owner = "Josh Habdas" date = "2019" license = "agpl-3.0-or-later" +++
With header
attribute and plain text:
{{</* hackcss-card header="Title" text="Lorem ipsum dolor sit amet" /*/>}}
{{< hackcss-card header="Title" text="Lorem ipsum dolor sit amet" />}}
With header
attribute and formatted text:
{{</* hackcss-card header="Hacker Ipsum" >}}<samp>Haxx0r ipsum true class firewall continue bytes recursively grep <b>Linus Torvalds</b> gobble Trojan horse d00dz baz. Crack bang <mark>ssh for int buffer</mark> sql fork mailbomb gnu then client salt spoof. Server python error throw sudo fatal while echo dereference concurrently.</samp>{{< /hackcss-card */>}}
{{< hackcss-card header="Hacker Ipsum" >}}Haxx0r ipsum true class firewall continue bytes recursively grep Linus Torvalds gobble Trojan horse d00dz baz. Crack bang ssh for int buffer sql fork mailbomb gnu then client salt spoof. Server python error throw sudo fatal while echo dereference concurrently.{{< /hackcss-card >}}
With header
attribute, External, Button and HTML:
{{</* hackcss-card header="DJI Mavic Air Quadcopter with Remote Controller - Arctic White" >}}
<img src="/images/products/mavic-air.png">
{{< external rel="next" href="https://go.habd.as/mavic-air" >}}
{{< hackcss-button type="primary" text="View on Amazon" isblock="true" />}}
{{< /external >}}
{{< /hackcss-card */>}}
{{< hackcss-card header="DJI Mavic Air Quadcopter with Remote Controller - Arctic White" >}} {{< external rel="next" href="https://go.habd.as/mavic-air" >}} {{< hackcss-button type="primary" text="View on Amazon" isblock="true" />}} {{< /external >}} {{< /hackcss-card >}}