カスケーディングスタイルシートリファレンス・ ブラウザの種類による対応状況などもプロパティごとに掲載!

CSS −スタイルシートリファレンス− ブラウザの種類による対応状況などもプロパティごとに掲載!

スタイルシートの基礎 CSS
バナーはダウンロード
してお使い下さい。

ボックスの枠線・色・種類 sample01
ボックスの枠線・色・種類 sample02
ボックスの枠線・色・種類 sample03
ボックスの枠線・色・種類 sample04
ボックスの枠線・色・種類 sample05
ボックスの枠線・色・種類 sample06
ボックスの枠線・色・種類 sample07
ボックスの枠線・色・種類 sample08
ボックスの枠線・色・種類 sample09
ボックスの枠線・色・種類 sample10

手軽にコピーしてページをレイアウトできるスタイルシート集です。 少しづつ種類を増やして行く予定です。 そのままソースをコピーして使用すると簡単に使えます。

<style type="text/css">
<!--
この部分にソースをコピー
-->
</style>

<head>と</head>内に上記のソースを記述し、 この部分にソースをコピーの文字列部分に、 設定したいスタイルのソースをコピーして書き換えてください。

※なお、このスタイルシートはブラウザの種類やバージョンの違いによって 上手く表示されないものもありますのでご注意下さい。IE・NNでは最近の新しいバージョンのものでは 殆どがきちんと表示されます。又、上手く活用するにはほんの少しCSSの知識が必要かも知れません。

これらは段落やテーブル・テーブルのセルなどの枠線の色や背景色・枠線の種類のスタイルを設定しています。 主に、<p>や<table>、<td>他・・タグに設定できます。 設定の仕方は、スタイルシートのソース(黄色部分のソース)を<head></head>の間の <style type="text/css"> <!-- ■ --></style> ■ 部分にコピーペーストします。 そして、設定したいタグの中に、class="〜の部分のソースを記述すれば出来上がり。 例えば、sample01を<p>に設定するならば以下のように記述します。

<p class="box01">

▼ ボックスの枠線・色・種類 sample09

sample09

■<style type="text/css"><!--〜 に挿入するソース

.box09	{border-width:1px;
	border-style:dashed;
	border-color:#cccc99;
	padding:2px;
	margin:2px}
■タグ内に挿入するソース

class="box09"

LINK

 

◆ このページのTOPへ ◆







Copyright © 2004 − ykr414. All Rights Reserved.