From 3ab3a9d09955772ec56ddadbba49954b4edd6a3e Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Tue, 6 Nov 2018 18:52:37 +0800 Subject: Update the Docs completely --- docs/components/cards.html | 313 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 313 insertions(+) create mode 100644 docs/components/cards.html (limited to 'docs/components/cards.html') diff --git a/docs/components/cards.html b/docs/components/cards.html new file mode 100644 index 0000000..ad0a5e8 --- /dev/null +++ b/docs/components/cards.html @@ -0,0 +1,313 @@ + + + + Cards - Components - Spectre.css CSS Framework + + + + + + + + + + + + + + + +
+
+
GitHubSponsor
+
+ +
+
+
+

Cards

+
+
+ + + +
+
+ + +
+
+

Cards are flexible content containers.

+
+
+
+
OS X El Capitan
+
+
Microsoft
+
Software and hardware
+
+
Empower every person and every organization on the planet to achieve more.
+
Do
+
+
+
+
+
+
Apple
+
Hardware and software
+
+
OS X Yosemite
+
To make a contribution to the world by making tools for the mind that advance humankind.
+
+
+ + + +
+
+
+
+
+
+
macOS Sierra
+
+ +
Google I/O
+
Software and hardware
+
+
An immersive, three-day experience focused on exploring the next generation of technology, mobile and beyond.
+
+
+
+
+
OS X El Capitan
+
BuyShare
+
Surface Studio. Turn your desk into a Studio. Surface Studio is designed for the creative process.
+
+
+
+
+
+
Apple
+
Hardware and software
+
+
To make a contribution to the world by making tools for the mind that advance humankind.
+
macOS Sierra
+
+
+
+
+
+
Google
+
Software and hardware
+
+
Organize the world’s information and make it universally accessible and useful.
+
OS X Yosemite
+
SearchShare
+
+
+
+

Add a container element with the card class. + And add child elements with the card-image, card-header, card-body and/or card-footer classes. + The card-image can be placed in any position. +

+ 
<div class="card">
+  <div class="card-image">
+    <img src="img/osx-el-capitan.jpg" class="img-responsive">
+  </div>
+  <div class="card-header">
+    <div class="card-title h5">...</div>
+    <div class="card-subtitle text-gray">...</div>
+  </div>
+  <div class="card-body">
+    ...
+  </div>
+  <div class="card-footer">
+    <button class="btn btn-primary">...</button>
+  </div>
+</div>
+
+
+ +
+
+ +
+
+
+ + + \ No newline at end of file -- cgit v1.3.1-23-gd82d