-
CSSを使用してオブジェクトの周りにグローを作成します
グロー効果は、オブジェクトの周囲にグローを作成するために使用されます。透明な画像の場合、不透明なピクセルの周りにグローが作成されます。 このフィルターでは次のパラメーターを使用できます パラメータ 説明 色 グローにしたい色。 強度 グローの強度(1から255)。 例 次のコードを実行して、オブジェクトの周囲にグローを作成してみてください。 <html> <head> </head> <body> &n
-
CSSを使用してオブジェクトの色を256色のグレーに変換します
グレースケール効果を使用して、オブジェクトの色を256色のグレーに変換します。このフィルターでは、次のパラメーターが使用されます。 パラメータ 説明 グレー オブジェクトの色を256色のグレーに変換します。 例 次のコードを実行して、グレースケール効果を設定できます。 <html> <head> </head> <body> <img src="/css/images/lo
-
CSSを使用したシャドウフィルター
シャドウフィルターは、指定された方向と色で減衰したシャドウを作成するために使用されます。 このフィルターでは次のパラメーターを使用できます パラメータ 説明 色 シャドウにしたい色。 方向 ぼかしの方向。時計回りに進み、45度単位で丸められます。デフォルト値は270(左)です。 0=上 45=右上 90=右 135=右下 180=下 225=左下 270=左 315=左上 例 次のコードを実行して、シャドウフィルターを実装してみてください- <html> <head> &nbs
-
CSSでリンクの色を設定する
:linkを使用します リンクの色を設定するクラス。可能な値は、任意の有効な形式の任意の色名です。 例 次のコードを実行して、リンクの色を設定してみてください- <html> <head> <style> a:link { color:#FF0000 } &n
-
CSSのoutline-widthプロパティ
アウトライン幅 プロパティは、アウトラインの幅を設定するために使用されます。その値は、長さ、または値の1つである必要があります thin、medium、 または厚い 、border-width属性と同じです。 例 <html> <head> </head> <body> <p style = "outline-width:thin; outline-style:solid;"> &n
-
CSSでアクティブなリンクの色を変更する方法
:activeを使用する アクティブなリンクの色を変更するクラス。可能な値は、任意の有効な形式の任意の色名です。 例 次のコードを実行して、アクティブなリンクの色を実装してみてください- <html> <head> <style> a:active { color: #FF00CC &
-
CSSでフォーカスされたリンクの色を変更する方法
:focusを使用する フォーカスされたリンクの色を変更するクラス。可能な値は、任意の有効な形式の任意の色名です。 例 次のコードを実行して、フォーカスされたリンクの色を実装してみてください- <html> <head> <style> a:focus { color: #0000FF
-
CSSの使用法:最初の行の疑似要素
この要素を使用して、セレクターのテキストの最初の行に特別なスタイルを追加します。次の例は、:first-line要素を使用して、ドキュメントの要素の最初の行に特殊効果を追加する方法を示しています。 例 <html> <head> <style> p:first-line { text-decoration: underline; &nbs
-
CSSを使用したセレクターのテキストの最初の文字に特別なスタイルを追加するために使用される要素
:first-letter要素を使用して、ドキュメント内の要素の最初の文字に特殊効果を追加します。次のコードを実行して、テキストの最初の文字に特別なスタイルを追加してみてください- 例 <html> <head> <style> p:first-letter { font-size: 5em; &
-
CSSを使用する要素の前にコンテンツを挿入するために使用される要素
:before要素を使用して、要素の前にコンテンツを挿入します。 例 次のコードを実行して、CSS-を使用して要素の前にコンテンツを挿入してみてください。 <html> <head> <style> p:before { content: url(/images/bullet.gif) &nb
-
CSSで左アニメーション効果をフェードアウト
CSSを使用して画像にフェードアウト左アニメーション効果を実装するには、次のコードを実行してみてください- 例 <html> <head> <style> .animated { background-image: url(/css/images/logo.png);
-
CSSの使用法!重要なルール
!importantルールは、CSSをカスケードする方法を提供します。また、常に適用されるルールも含まれています。 !importantプロパティを持つルールは、CSSドキュメントのどこにあるかに関係なく、常に適用されます。 たとえば、次のスタイルシートでは、最初に適用されたスタイルプロパティが赤であっても、段落テキストは黒になります- <style> <!-- p { color: #ff0000; } p { &n
-
CSSで記述されたスタイルシートを設定する文字を示します
CSSで記述されたスタイルシートを設定する文字を示すには、@characterルールを使用します。 @charsetルールは、スタイルシートの先頭にスペースを入れずに最初に記述する必要があります。値は引用符で囲まれており、標準の文字セットの1つである必要があります。 例 例を見てみましょう 、 <style> <!-- @charset "iso-8859-1" .......other CSS rules ..... -
-
CSSアウトラインスタイルのプロパティ
アウトラインスタイル プロパティは、要素を囲む線のスタイルを指定します。次のいずれかの値を取ることができます- なし- 境界はない。 (outline-width:0に相当;) 堅実- アウトラインは1本の実線です。 点線- アウトラインは一連のドットです。 破線- アウトラインは一連の短い線です。 ダブル- アウトラインは2本の実線です。 溝- アウトラインはページに刻まれているように見えます。 尾根- 輪郭は溝の反対に見えます。 挿入図- アウトラインを使用すると、ボックスがページに埋め込まれているように見えます。 最初- アウトラインを使用すると、ボックスがキャンバスから出てきているよ
-
CSSのアウトラインカラープロパティ
アウトラインカラー プロパティを使用すると、アウトラインの色を指定できます。その値は、colorおよびborder-colorプロパティと同様に、色名、16進色、またはRGB値のいずれかである必要があります。 例 次のコードを実行してoutline-colorを実装してみてください。 プロパティ- <html> <head> </head> <body> <p style = "outline-width:thi
-
CSSでの:visited疑似クラスの使用
:訪問済み 疑似クラスは、訪問したリンクに特別なスタイルを追加するために使用されます。可能な値は、任意の有効な形式の任意の色名です。 例 <html> <head> <style> a:visited { color: #006600 } &nb
-
CSSでのmarginプロパティの使用
マージン プロパティは、HTML要素の周囲のスペースを定義します。負の値を使用してコンテンツをオーバーラップさせることができます。 1つの宣言でマージンプロパティを設定するための省略形プロパティを指定します。 例 次のコードを実行してマージンを設定してみてください- <html> <head> </head> <body> <p style = "margin: 20px; border:2px solid ye
-
CSSでその行にマウスポインタを合わせると、リンクの色が変わります
:hoverを使用します リンクの上にマウスポインタを置いたときにリンクの色を変更するクラス。 例 <html> <head> <style> a:hover { color: #FFCC00 } </style> &nb
-
CSSでの:hover疑似クラスの使用
:ホバー 疑似クラスは、要素の上にマウスを置いたときに要素に特別なスタイルを追加するために使用されます。可能な値は、任意の有効な形式の任意の色名です。 例 <html> <head> <style> a:hover { color: #FFCC00 } &nbs
-
CSSでの:active疑似クラスの使用
:active疑似クラスは、アクティブな要素に特別なスタイルを追加するために使用されます。可能な値は、任意の有効な形式の任意の色名です。 例 <html> <head> <style> a:active { color: #FF00CC; } &n