CSS

 Computer >> コンピューター >  >> プログラミング >> CSS
  1. CSSでのリストマーカーの位置の変更

    CSSのlist-style-positionプロパティは、リストアイテムのマーカーの位置を設定するために使用されます。このプロパティのデフォルト値はoutsideであり、これによりマーカーがリストアイテムの外側に設定されます。 構文 CSSlist-style-positionプロパティの構文は次のとおりです- Selector {    list-style-position: /*value*/ } 例 次の例は、CSS list-style-property −を示しています。 <!DOCTYPE html> <html> <hea

  2. リストマーカーとして画像を使用するCSSの場合

    CSSのlist-style-imageプロパティは、画像をリストアイテムのマーカーとして設定するために使用されます。 構文 CSSlist-style-imageプロパティの構文は次のとおりです- Selector {    list-style-image: /*value*/ } 例 次の例は、CSSのlist-style-imageプロパティ-を示しています。 <!DOCTYPE html> <html> <head> <style> ul {    width: 150px;   &

  3. CSSの画像マーカーのクロスブラウザソリューション

    すべてのブラウザで画像マーカーを正しく表示するには、クロスブラウザソリューションが必要です。画像マーカーの後のテキストの配置が歪むことがあります。均一な出力を実現するために、マーカーとして使用する画像を背景として指定し、それに応じて位置合わせします。 例 次の例は、リストのスタイル設定を示しています- <!DOCTYPE html> <html> <head> <style> ul{    list-style-type: none;    padding: 0px;    margi

  4. CSSのユニバーサルセレクター

    CSS *セレクターは、HTMLDOMのすべての要素を選択するために使用されるユニバーサルセレクターです。 構文 CSSユニバーサルセレクターの構文は次のとおりです- * {    /*declarations*/ } 次の例は、CSSユニバーサルセレクターを示しています- 例 <!DOCTYPE html> <html> <head> <style> * {    margin: 15px;    padding: 5px;    border: 2px sol

  5. CSSでのリストのスタイリング

    CSSを使用すると、背景、リストスタイルのプロパティ、フォントスタイルなどを指定して、リストのスタイルを設定できます。list-styleプロパティは、list-style-type、list-styleを指定するための省略形です。 -image、list-style-positionを同じ順序で。 構文 CSSリストスタイルプロパティの構文は次のとおりです- Selector {    list-style: /*value*/ } 例 次の例は、リストのスタイル設定を示しています- <!DOCTYPE html> <html> <hea

  6. CSSのリストスタイルのShorthandプロパティ

    CSSのlist-styleプロパティは、要素のlist-style-type、list-style-position、list-style-imageを指定するために使用されます。 構文 CSSリストスタイルプロパティの構文は次のとおりです- Selector {    list-style: /*value*/ } 例 次の例は、リストのスタイル設定を示しています- <!DOCTYPE html> <html> <head> <style> body {    font-size: 1.33em;

  7. CSS3ボーダー画像の追加

    CSS3に境界線画像を追加するには、border-imageプロパティを使用します。これは、次のプロパティの省略形のプロパティです- border-image-source border-image-slice border-image-width border-image-outset border-image-repeat 値は次のように設定できます; border-image: source slice width outset repeat|initial|inherit; 例 例を見てみましょう- <!DOCTYPE html> <html> <he

  8. CSS3での色の定義

    CSS3で色を定義するには、RGB、RGBA、HSL、およびHSLAを使用します。これにより、色の値を使用でき、16進値を使用して色を定義することもできます- CSS3 RGBA 色の値は、赤、緑、青、アルファ用です。アルファは色の不透明度、つまり0.0から1.0の間の数値です。ここで、1.0は完全に不透明になります。ここでは、RGBAのAlphaパラメータで作成された不透明度の違いを確認できます- 例 ここで、RGBAカラー値の例を見てみましょう- <!DOCTYPE html> <html> <head> <style> #de

  9. CSSの相対的な長さの単位

    CSSの相対的な長さの単位は、別の長さプロパティを基準にした長さを指定するために使用されます。 Sr.No 単位と説明 1 em 要素のフォントサイズを基準にしています。つまり、4emは、現在のフォントの4倍のサイズを意味します。 2 例 現在のフォントのエックスハイトを基準にしています 3 ch 0の幅を基準に 4 rem ルート要素のフォントサイズを基準 5 vw ビューポートの幅の1％に対して* 6 vh ビューポートの高さの1％に対して* 7 vm

  10. CSSを使用した要素の背景のスタイリング

    要素の背景のスタイルを設定するには、背景画像、背景位置を設定できます。それで、背景の繰り返しを設定して、画像を水平または垂直に繰り返します。 背景位置 背景位置とは、背景画像の開始位置を設定することです。これには、background-positionプロパティを使用します。 例 例を見てみましょう- <!DOCTYPE html> <html> <head> <style> body {    background-image: url("https://www.tutorialspoint.com/image

  11. CSSの子セレクター

    CSS子セレクターは、特定の親要素を持つすべての子要素を選択するために使用されます。 構文 CSS子セレクターの構文は次のとおりです- element > element { /*declarations*/ } 例 次の例は、CSSの子孫セレクター-を示しています。 <!DOCTYPE html> <html> <head> <style> * {    padding: 5px; } article > div {    border: dashed midnightblue; &nbs

  12. CSSのパディングの省略形プロパティ

    CSSのpaddingプロパティを使用すると、padding-top、padding-right、padding-bottom、padding-leftのパディングを設定できます。略記です。 最初に例を見てみましょう- 例：パディング：10px 5px 7px 10px; ここで top padding is 10px right padding is 5px bottom padding is 7px left padding is 10px 例 次の例は、CSSパディングプロパティ-を示しています。 <!DOCTYPE html> <html> <

  13. CSSを使用して境界線を作成およびスタイル設定する方法は？

    要素の境界線を定義し、CSSを使用してスタイルを設定できます。 CSS borderプロパティは、要素のborderプロパティを定義するために使用されます。これは、border-width、border-style、border-colorの省略形です。さらに、画像を境界線として指定できます。 構文 CSSボーダープロパティの構文は次のとおりです- Selector {    border: /*value*/ } 例 次の例は、CSSボーダープロパティ-を示しています。 <!DOCTYPE html> <html> <head> &

  14. CSSボーダープロパティ

    CSS borderプロパティは、要素のborderプロパティを定義するために使用されます。これは、border-width、border-style、border-colorの省略形です。 border-top、border-rightなどのサイド固有のプロパティを使用して個々のサイドのスタイルを設定できます。 構文 CSSボーダープロパティの構文は次のとおりです- Selector {    border: /*value*/ } 例 次の例は、CSSボーダープロパティ-を示しています。 <!DOCTYPE html> <html> <

  15. CSSのborder-widthプロパティ

    CSS border-widthプロパティは、要素の境界線の幅を指定するために使用されます。また、border-top-width、border-right-width、border-left-width、border-right-widthプロパティを使用して、個々の辺の幅を設定することもできます。 構文 CSSborder-widthプロパティの構文は次のとおりです- Selector {    border-width: /*value*/ } 例 次の例は、CSSのborder-widthプロパティ-を示しています。 <!DOCTYPE html>

  16. CSSの要素の背景のスタイリング

    background属性を使用して要素の背景プロパティを指定できます。次の値を取ることができます：background-color、background-image、background-repeat、background-position、background-clip、background-size、background-origin、background-attachment。 構文 CSSバックグラウンドプロパティの構文は次のとおりです- Selector {    background: /*value*/ } 例 次の例は、CSSの背景プロパティ-を示してい

  17. CSSを使用してインラインで表示

    ブロックとは異なり、インライン要素は同じ行自体で始まり、割り当てられた幅のみを取ります。ここで、表示を実装する例を見てみましょう。CSSのインラインプロパティ値- 例 例を見てみましょう- <!DOCTYPE html> <html> <head> <style> span {    background-color: orange;    color: white; } p.demo {    display: none; } span.demo1 {    di

  18. CSSでNoneを表示しない

    要素を削除するには、CSSのdisplaynoneプロパティ値を使用します。 noneプロパティ値を実装する例を見てみましょう- 例 例を見てみましょう- <!DOCTYPE html> <html> <head> <style> span {    background-color: orange;    color: white; } p.demo {    display: none; } span.demo1 {    display: inline; }

  19. CSSを使用した要素の可視性の制御

    CSS Displayプロパティは、Webページ上の要素の表示を制御するために使用されます。その値の一部がここに表示されます- 要素をインラインレベルのフレックスコンテナとして表示します Sr.No プロパティの値と説明 1 インライン 要素をインライン要素として表示します。 2 ブロック 要素をブロック要素として表示します。 3 コンテンツ コンテナを非表示にし、要素の子要素をDOMの次のレベルの子にします 4 フレックス 要素をブロックレベルのフレックスコンテナとして表示します 5 グリッド 要素をブロックレ

  20. CSSを使用してテーブルに境界線を追加する

    CSSでテーブルに境界線を追加するには、bordersプロパティを使用します。 例 例を見てみましょう- <!DOCTYPE html> <html> <head> <style> table, th, td {    border: 2px dashed orange; } </style> </head> <body> <h2>Team Ranking Table</h2> <table> <tr> <th>Team</

Total 1566 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:24/79  20-コンピューター/Page Goto:1 18 19 20 21 22 23 24 25 26 27 28 29 30