➖ Border and Outline

2879 ワード
CSS border outline テキストリンク
Inputタグをスタイル化する場合、border属性とoutline属性の違いは何ですか?

Border


borderは、要素の内線を定義するためのプロパティです.
  • borderは要素の内部に作成されます.
  • borderが空間を占めています.
    • border
          input {
        background-color: gray;
      }

    border:none
          input {
        border: none;        
        background-color: gray;
      }

    Outline


    アウトライン属性は、要素の外線を定義する属性です.
  • アウトラインはスペースを占めません.
  • inputラベルでoutline:noneを指定すると、フォーカス時にoutlineが強調表示されません.
  • outlineは要素の外部に作成されます.
    • アウトライン:noneが適用されていない場合
          input {
        border: none;
        background-color: gray;
      }


    アウトライン:noneを適用する場合
          input {
        border: none;
        outline : none;
        background-color: gray;
      }


    Conclusion


    borderとoutlineの違いは微妙なので、上記以外はあまり気にする必要はないようです.
    ただし、stlingに注意するならborderradiusなどborder属性の選択範囲がたくさんあるので、borderを選んで使いましょう.
    -以上-
    [白俊]-ステップ解答(繰り返し)11021
    サブクラス化QWidget