コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > jsコントロールCSSスタイル属性構文比較表_基礎知識

jsコントロールCSSスタイル属性構文比較表_基礎知識

WBOY
リリース： 2016-05-16 17:47:00
オリジナル
1400 人が閲覧しました

CSS と JS は密接に連携して、ページに多くのユニークな効果を追加します。特別な効果を実現するには、JavaScript を使用して特定のタグの CSS プロパティを動的に変更する必要があります。

たとえば、フローティング広告表示をオフにするためによく使用されます: document.getElementById('ad').style.display='none'; と同等: .ad{ display:none}.

以下は CSS スタイルシートを制御する JS の構文比較です：

CSS语法 (不区分大小写) JavaScript语法 (区分大小写) 
border border 
border-bottom borderBottom 
border-bottom-color borderBottomColor 
border-bottom-style borderBottomStyle 
border-bottom-width borderBottomWidth 
border-color borderColor 
border-left borderLeft 
border-left-color borderLeftColor 
border-left-style borderLeftStyle 
border-left-width borderLeftWidth 
border-right borderRight 
border-right-color borderRightColor 
border-right-style borderRightStyle 
border-right-width borderRightWidth 
border-style borderStyle 
border-top borderTop 
border-top-color borderTopColor 
border-top-style borderTopStyle 
border-top-width borderTopWidth 
border-width borderWidth 
clear clear 
float floatStyle 
margin margin 
margin-bottom marginBottom 
margin-left marginLeft 
margin-right marginRight 
margin-top marginTop 
padding padding 
padding-bottom paddingBottom 
padding-left paddingLeft 
padding-right paddingRight 
padding-top paddingTop
background background 
background-attachment backgroundAttachment 
background-color backgroundColor 
background-image backgroundImage 
background-position backgroundPosition 
background-repeat backgroundRepeat 
color color 
display display 
list-style-type listStyleType 
list-style-image listStyleImage 
list-style-position listStylePosition 
list-style listStyle 
white-space whiteSpace 
font font 
font-family fontFamily 
font-size fontSize 
font-style fontStyle 
font-variant fontVariant 
font-weight fontWeight 
letter-spacing letterSpacing 
line-break lineBreak 
line-height lineHeight 
text-align textAlign 
text-decoration textDecoration 
text-indent textIndent 
text-justify textJustify 
text-transform textTransform 
vertical-align verticalAlign
関連ラベル：
文法
ソース：php.cn
前の記事：Ajaxは成功コールバックを実行せず、エラーコールバックを実行する_基礎知識 次の記事：jqueryの$getjson呼び出しとリモートJSON文字列の取得問題_javascriptスキル
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
表セルのコンテナが親セルの高さ全体を占めるようにしてください。 Flexboxを使用せずにコンテンツを垂直方向に整列させようとしています。このユースケースにはいくつかの問題があるため、垂直方向に整列されたテーブルでそれを行おうとしていますが、問...
から 2024-04-04 16:03:18
0
1
404
サイドバーが開いたときに div が左に押されるように、サイドバーの隣に div を配置する方法 サイドバーを開くと、メインコンテンツの div が右に寄せられるのではなくサイドバーの下に配置され、表示されるときの div の px はサイドバーの幅と等しくなるはずです。 cs...
から 2024-04-03 14:47:21
0
1
325
CSS スタイルシートが機能しなくなり、HTML ファイルにリンクしなくなりました。原因は何でしょうか? 多くのフォーラムで答えを探し、約 50 の Google リンクを調べましたが、有効なものが見つかりませんでした。CSS が HTML に表示されません。私のコードは、フレックスボ...
から 2024-04-03 09:49:45
0
1
402
スクロールバーが表示されていない場合の tbody の幅を変更する スクロールバーのあるテーブルがあり、テーブルをフィルターするとスクロールバーが表示されませんが、これは私にとっては良いことですが、問題は幅が変化し、テーブルの幅が大きくなることです...
から 2024-04-02 11:15:58
0
1
277
React.js CSS ウィンドウの幅 Reactを使用してレスポンシブWebサイトを開発しています。スタイル設定には CSS スタイルシートを使用します。応答部分は @media クエリを使用して CSS で実装されま...
から 2024-03-31 16:31:23
0
1
386
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート