ホームページ > 記事 > ウェブフロントエンド > CSS の知識ポイントのコレクション
この記事ではCSSの知識ポイントをまとめて紹介します
CreateTime--2016年9月29日 09:43:10
Author:Marydon
1.背景色の線形グラデーション
background-color:linear-gradient(100deg,#FFF,#111);/*由黑色向白色渐变 deg表示度数*/
UpdateTime--2016 10月25日11: 37:53
UpdateTime--2016 年 11 月 23 日 09:53:46
2. テーブルの境界線を 1 つの境界線に結合するように設定します
border-collapse: collapse;/*前提:table的border=1或border="1"或border="1px"*/
UpdateTime--2016 10 月 29 日 09:04:07
3. 自動的に伸びるpの最小の高さと高さを設定する
#pHeight{height:auto;min-height:5px;width:800px; background:#bbeeeb;margin:0 auto;}
<p id="pHeight"> 此p具有最小高度且高度可以随着内容的增高而自动伸展 <br/> 此p具有最小高度且高度可以随着内容的增高而自动伸展 </p>
自動的に伸びる最小の幅と幅を設定する
width:auto;min-width:5px;height:800px;
4. 改行を禁止する 2つの方法
方法1:
通常、ブラウザに表示されるドキュメントはブラウザのバナーの下に達すると自動的に折り返されますが、テキストが
方法 2:
CSS スタイルを使用します
style="white-space:nowrap;"
UpdateTime--11 月 25, 2016 08:57:49
改行を禁止するように td を設定します
<td nowrap="nowrap"></td>
UpdateTime--10月 31, 2016 09:44:17
5.表示スタイル
inline インライン要素(他の要素と1行を占有、改行なし、幅、高さの設定不可)
ブロック Level要素(1行を占有)行のみ、幅と高さを設定可能)
inline-block インラインのブロックレベル要素(他の要素と1行を占有しますが、幅と高さは設定可能)(インライン要素とブロックレベル要素の両方の性質を持ちます)
none 要素を非表示にする
document.getElementById("aa").style.display="";//表示的是:清除display样式,display将使用默认值(块元素会变成block,内联元素会变成inline)
UpdateTime--Novell 24, 2016 11:44:31
6.ime-mode syntax and text-transform syntax
UpdateTime-- December 15, 2016 19:52:16
/*屏蔽输入法,可以用来禁止录入中文*/ ime-mode:disabled; //IE兼容,chrome不兼容 <input type="text" name="mobile" style="ime-mode:disabled;" /> /*将输入的英文字母转全部换成大写字母*/ text-transform:uppercase; <input type="text" name="mobile" style="text-transform:uppercase;" /> UpdateTime--2017年1月9日10:23:23 /*将输入的英文字母转全部换成小写字母*/ text-transform:lowercase; <input type="text" style="text-transform:lowercase;"/>
詳細な紹介
ime-mode構文: (この構文はGoogleブラウザでは無効であり、jsで制御する必要があります。「入力テキストボックス入力コンテンツコントロール」ファイルを参照してください)
ime-mode: auto | active | inactive | disabled
値:
auto: デフォルト値。 IMEのステータスには影響しません。 ime-mode属性が指定されていない場合と同じ
active: IMEで入力されたすべての文字を指定します。それは、現地言語の入力方法を有効にすることです。ユーザーは IME を無効化することもできます
inactive: IME を使用せずに入力されたすべての文字を指定します。それは、非母国語を活性化することです。ユーザーは引き続き IME を無効にすることができます
disabled: IME を完全に無効にします。フォーカスされたコントロール (入力ボックスなど) では、ユーザーは IME をアクティブにすることができません
text-transform 構文:
text-transform: none | uppercase | lowercase
値:
none : デフォルト値。変換は行われません
capitalize: 各単語の最初の文字を大文字に変換し、残りの文字は変換されません
大文字: 大文字に変換します
小文字: 小文字に変換します
7 p ボックスのときに自動的に折り返されるように p の内容を設定します。高さ幅を設定した後、表示されるコンテンツが幅を超え、コンテンツが幅を超えて折り返されない場合は、CSS スタイルを設定します
word-wrap:break-word;
8。コンテナの幅、余分な部分は「..」でマークされます フォーム表示
前提条件: p と li の幅を最初に決定する必要があります 属性を追加します
text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
9. テキスト ボックスとパスワード ボックスの表示スタイル コントロールIE ブラウザの場合
/*去除IE浏览器文本框右侧出现叉号*/ #aa::-ms-clear { display:none; } /*去除IE浏览器密码框右侧出现眼睛*/ #bb::-ms-reveal { display:none; }
<input id="aa" type="text"/><input id="bb" type="password"/>
以上がCSS の知識ポイントのコレクションの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。