w3-color クラスは、マーケティング、道路標識や付箋で使用されている現代的な色からインスパイアされています:
Red
Green
Blue
Black
Pink
Teal
Indigo
Brown
w3-container クラスは、W3.CSS クラスの中で最も重要です。 そこには、等しく次のような設定が提供されます:
w3-container クラスは、次のような HTML コンテナ要素の 全タイプに使用することができます:
<div>、<header>、<footer>、<article>、<section>、<blockquote>、<form>、等。
This article is light grey and the text is brown. This article is light grey and the text is brown. This article is light grey and the text is brown. This article is light grey and the text is brown. This article is light grey and the text is brown.
This is a footer.
w3-panel クラスは、全ての種類のノートや引用を表示することができます:
London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.
London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.
w3-panel クラスは、すべての種類のアラートにも使用することができます:
Red often indicates a dangerous or potentially negative action.
Yellow and orange often indicates a warning that might need attention.
Green often indicates a successful or positive action.
Blue often indicates a neutral informative change or action.
w3-card クラスは画像やノートの両方に適しています:
w3-card-2
w3-card-4
w3-card-8
A car is a wheeled, self-powered motor vehicle used for transportation.
Most definitions of the term specify that cars are designed to run primarily on roads,
to have seating for one to eight people, and to typically have four wheels.
(Wikipedia)
w3-table クラスは、すべての種類のテーブルを取扱うことができます:
First Name | Last Name | Points |
---|---|---|
Jill | Smith | 50 |
Eve | Jackson | 94 |
Adam | Johnson | 67 |
Anja | Bore | 100 |
w3-ul クラスは、すべての種類のリストを取り扱うことができます:
w3-btn クラスは、すべてのサイズと種類のボタンを提供します:
w3-btn-floating ボタンは、円形で重要な関数を意味するものです。
w3-tag と w3-badge クラスは、すべての種類タグやバッジや標識を表示することが可能です:
2 8 A B
New Warning Danger Info
responsive grid クラスは、PC、ノート PC、タブレット、およびモバイルの全デバイスタイプにレスポンシブを提供します。
1/2
1/2
1/3
1/3
1/3
1/3
2/3
1/4
1/4
1/4
1/4
1/2
1/4
1/4
2/3
1/3
1/1
1/4
1/4
1/2
1/4
1/2
1/4
50px
rest
1/4
rest
100px
45px
rest
W3.CSS は、small、medium、large クラスを使用することで、 12 カラム・モバイル・ファースト流動グリッドもサポートしています。
w3-modal クラスは、純粋な HTML だけでモーダルダイアログを提供します:
Modal Image:
w3-progressbar クラスは、プログレスバーを作成します:
w3-dropdown クラスは、ドロップダウンを提供します:
w3-accordion クラスは、アコーディオン/コンテンツの伸縮を提供します:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Accordion with Images:
Trolltunga, Norway
タブ は、単一ページの Web アプリケーションや、 いろいろな題材を表示する Web ページに最適です。
London is the capital city of England.
It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.
Paris is the capital of France.
Paris area is one of the largest population centers in Europe, with more than 12 million inhabitants.
Tokyo is the capital of Japan.
It is the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.
タブ付きイメージギャラリー:
w3-navbar クラスは、ナビゲーションバーを作成します:
w3-sidenav クラスは、サイド・ナビゲーションを作成します:
w3-pagination クラスは、ページナビゲーションのための簡単な方法を提供します:
W3.CSS は、画像やその他のコンテンツを巡回するためのスライドショーを提供します:
w3-animate クラスは、要素のスライドやフェードインのための簡単な方法を提供します:
W3CSS で、画像をスタイリングするのは簡単です:
w3-input クラスは、入力フォームのためのものです:
リスト、テーブル、ドロップダウンなどの中から指定の要素を検索するために、 W3.CSS Filters を使用します:
Name | Country |
---|---|
Alfreds Futterkiste | Germany |
Berglunds snabbkop | Sweden |
Island Trading | UK |
Koniglich Essen | Germany |
Laughing Bacchus Winecellars | Canada |
Magazzini Alimentari Riuniti | Italy |
North/South | UK |
Paris specialites | France |
W3.CSS を使用すると、Web ページに fonts を追加することは極めて簡単です:
w3-tooltip クラスは、すべての種類ツールチップを表示することができます:
Hover over this text! Tooltip content
Hover over this text! Tooltip content
Hover over this text! Tooltip content
A car is a wheeled, self-powered motor vehicle used for transportation. Most definitions of the term specify that cars are designed to run primarily on roads.
事前に定義されたカラー・テーマは、モバイル Web アプリケーションに特に適しています。
response to the animations was ridiculous
Touching, gripping and genuinely well made
A huge success for Marvel and Disney
response to the animations was ridiculous
Touching, gripping and genuinely well made
A huge success for Marvel and Disney