サイトマップ
お問い合わせ
このサイトについて
ホーム
WEB制作支援
HTMLリファレンス
スタイルシート
JavaScript
PHP/データベース
WEBデザイン
デザインテクニック
素材集/テンプレート
ウェブ配色の見本
ユーザビリティ
WEB運営
ウェブの開設と運営法
アクセスアップの技
アフィリエイト (WEB広告)
ドメインとサーバー
特集・トピックス
Web広告で収入を得る
独自ドメインの利点
使えるWeb作成ソフト
Webデザイナーになるには
SEOでアクセスアップ
光ファイバーの導入
リンク集
ウェブ作成リンク
無料リンク
オンラインソフトリンク
ユーザーリンク
ウェブコラム
参考文献一覧
サイトマップ
このサイトについて
お問い合わせ
eWebホーム
スタイルシートは、見栄えやレイアウトなどの表示に関する指定を行うものです。スタイルシートを用いるとHTMLだけでは表現できない様々なデザインが可能になります。
サンプルソースはご自由にカスタマイズなどをしてお使いください。
スタイルシートメニュー
1.
基本事項
2.
背景色・背景画像
3.
文字の装飾・フォント
4.
テキストの配置・変更
5.
余白や枠のレイアウト
6.
マウス・リスト・バー
7.
配置・位置・回り込み
8.
その他
9.
フィルタ (IE 5.5↑)
10.
フィルタ (IE 4.0↑)
11.
CSSサンプル集
基本事項
スタイルシートについて
基本的な書き方・単位など
スタイルシートの継承
スタイルシートリンク集
任意のタグだけに適用
ページ全体に適用
別ファイルから適用
定義済みスタイルを適用
指定した範囲に適用
背景色・背景画像の設定
背景色
background-color
画像の位置
background-position
背景画像
background-image
画像固定
background-attachment
画像の並び
background-repeat
背景の一括指定
background
文字の装飾・フォントの設定
文字色の指定
color
フォントスタイル
font-style
リンクの文字色・スタイル
フォントの太さ
font-weight
フォント飾り
text-decoration
フォントサイズ
font-size
文字の変換
text-transform
フォントの種類
font-family
ルビの揃え
ruby-align
スモールキャピタル
font-variant
ルビの位置
ruby-position
フォントの一括指定
font
テキストなどの配置・変更
行の高さの指定
line-height
行揃えの指定
text-align
インデントの挿入
text-indent
縦方向の位置
vertical-align
スペースや改行
white-space
禁則処理
line-break
縦書きに変換
writing-mode
文字間隔の指定
letter-spacing
縦書きに変換
layout-flow
単語間隔の指定
word-spacing
文字の並び
direction
フォームの全角/半角
ime-mode
ページ全体を縦書きにする
余白や枠のレイアウト
枠の太さ
border-width
幅と高さの指定
width height
枠の色
border-color
マージン(余白)
margin
枠の形式
border-style
枠と内容の間の空間
padding
枠の一括指定
border
マウスカーソル・リスト・バーの変更
カーソルの変更
cursor
リストの形式
list-style-type
カーソルに画像を指定
リストの配置
list-style-position
スクロールバー
scrollbar
リストの画像
list-style-image
バーの色を細かく変更
リストの一括指定
list-style
配置・位置・回り込み
要素の性質
display
位置
top bottom left right
配置方法
position
表示・非表示
visibility
左右の配置と回込み
float
重ねたときの優先順位
z-index
回り込みの解除
clear
スクロールバーを表示
overflow
その他
文字間隔
layout-grid-char
テーブルの表示
table-layout
行間隔
layout-grid-line
セル枠の表示
border-collapse
字間隔表示
layout-grid-type
改ページの位置
page-break
有効・無効
layout-grid-mode
外部スクリプト
behavior
行間や文字間隔
layout-grid
フィルタ (IE 5.5↑ DirectX)
透明度の指定
(Alpha)
指定した色を透過
(Chroma)
影をつける
(DropShadow)
影をつける
(Shadow)
ぼかしの指定
(Blur)
ぶれの指定
(MotionBlur)
波打たせる
(Wave)
輝かせる
(Glow)
型抜きをする
(MaskFilter)
モザイクをかける
(Pixelate)
浮き立たせる
(Emboss)
へこませる
(Engrave)
グラデーション
(Gradient)
複数の効果を適用
(BasicImage)
フィルタ (IE 4.0↑)
透明度の指定
(Alpha)
指定した色を透過
(Chroma)
影をつける
(DropShadow)
影をつける
(Shadow)
ぶれの指定
(Blur)
波打たせる
(Wave)
輝かせる
(Glow)
マスク
(Mask)
左右反転
(FlipH)
上下反転
(FlipV)
色反転
(Invert)
グレイスケール
(Gray)
X線写真にする
(Xray)
リンク<A> サンプル集
背景色変更・上下にライン
フォントの種類・サイズなど
ボタンのようにヘコませる
画像のようなリンク領域
引き出すようなボタンリンク
オンマウスでカーソルを変更
スクロールバー サンプル集
立体のないスクロールバー
少し変わったスクロールバー
立体のあるスクロールバー
通常のスクロールバー
水平線<HR> サンプル集
基本的な指定方法
立体的な水平線
点線・二重線など
グラデーションなどのフィルタ
画像を使った水平線
見出し<H1>〜<H3> サンプル集
シンプルな見出し
少し凝った見出し(左揃え)
画像を使った見出し
少し凝った見出し(中央揃え)
テーブル<TABLE> サンプル集
立体的なテーブル
縦線・横線などを消す
点線・二重線などを使う
特集・トピックス
検索エンジン最適化でアクセスアップ
今すぐ始める。ウェブで広告収入!
独自ドメインをGET! お勧めレンタルサーバー
使える! Web作成関連ソフト
ウェブデザイナーやSOHOになるためには?
←
eWeb ホーム
eWeb
/
HTML
/
スタイルシート
/
Javaスクリプト
/
PHP
/
素材集
/
テクニック
/
配色
/
ユーザビリティ
/
開設と運営
/
アクセスアップ
/
アフィリエイト
/
ドメイン
Copyright(C) 2004.
Aeu
,
Gundam
, eWeb, CSS Samples. All rights reserved. -
Home
-