問題タブ [bootstrap-4]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
164 参照

html - HTMLコードをCSSクラス名の変更から独立させる方法はありますか?

しばらくTwitter Bootstrap 3を使用していましたが、 Twitter Bootstrap 4が登場します。そして newには、たとえばに名前をTwitter Booststrap 変更するなど、いくつかの変更が伴います。現在のバージョンから将来のバージョンへの将来の移行の可能性のために、HTML コードを CSS クラス名の変更から独立させる方法はありますか? たとえば、クラスがある場合、独自のクラスを作成し、既存のクラスから作成する方法はありますか? (疑似コード) のようなもの:.table-condensed.table-sm.table-condensedtable-smallTwitter Bootstraptable-condensed

私はこの瞬間まで純粋なだけを使用しますCSS(私はフルスタックではなく、時々フロントエンド開発者です:))、これが何らかの方法で可能である場合、誰かが私に答えるなら、おそらくプリプロセッサまたはそのようなもので、私はとても感謝しています - よろしくお願いします!

0 投票する
1 に答える
701 参照

bootstrap-modal - 複数のデータ切り替えが正しく機能しない - Bootstrap 4

次のページがあります: http://mindspyder.com/newline/my-account.html

そして、そのページの次のコード:

ここで、ページに移動して青い [削除] ボタンをクリックすると、すべてが完全に機能します。[キャンセル] をクリックし、他のタブのいずれかをクリックしても、正常に機能します。問題は、[削除] をもう一度クリックすると、モーダルを開いたときに [削除] タブに戻らず、前のタブのままになることです。

私は何を間違っていますか?

0 投票する
1 に答える
743 参照

css-float - Flex を有効にすると Bootstrap v4 の列が浮きません

Bootstrap v4 を使用すると、cssfloatディレクティブが$enable-flex: true;Bootstrap の SCSS 変数内に設定されている場合、列に対して機能しません。これは仕組みによるものflexです。

で同じ効果をどのように達成できflexますか?

0 投票する
12 に答える
364003 参照

twitter-bootstrap - Bootstrap v4 に visible-** と hidden-** がありません

Bootstrap v3 では、hidden-** クラスを clearfix と組み合わせて使用​​して、さまざまな画面幅で複数列のレイアウトを制御することがよくあります。例えば、

複数の hidden-** を 1 つの DIV に組み合わせて、複数の列をさまざまな画面幅で正しく表示することができます。

例として、製品写真の行を表示したい場合、大きな画面サイズでは行ごとに 4 つ、小さな画面では 3 つ、非常に小さな画面では 2 つです。製品の写真は高さが異なる場合があるため、行が適切に壊れるように clearfix が必要です。

これはv3の例です...

http://jsbin.com/tosebayode/edit?html,css,output

v4 ではこれらのクラスが廃止され、visible/hidden-**-up/down クラスに置き換えられたので、代わりに複数の DIV で同じことを行う必要があるようです。

これはv4の同様の例です...

http://jsbin.com/sagowihowa/edit?html,css,output

そのため、同じことを達成するために、単一の DIV から、多くのアップ/ダウン クラスを含む複数の DIV を追加する必要が生じました。

から...

に...

私が見落としていた v4 でこれを行うより良い方法はありますか?

0 投票する
3 に答える
48308 参照

javascript - Bootstrap で Spacing ユーティリティ クラスを使用するにはどうすればよいですか

この記事では、Bootstrap 4 Spacing Utility Classes を見ました。彼はm-b-lginを使用していclassNameます。

しかし、react を使用して meteorjs で使用すると、何も起こりません。何か不足していますか、それともプラグインが不足していますか?

0 投票する
1 に答える
408 参照

brunch - ブランチでの UnCSS セットアップ

フロントエンド プロトタイプのビルド ツールとしてBrunchを使用していますが、 UnCSSプラグインのセットアップに苦労しています。クイックセットアップのためにBootstrap 4 -skeletonをインストールしました。UnCSS を除けば、すべてがスムーズに実行されています。

私が得るエラーbrunch build --productionはですerror: UnCSS: no stylesheets found。プラグインを次のように構成しました。

プロジェクトのソース ファイルは次の場所にありappます。index.htmlapp/assetsmain.scssstyles.cssapp/stylesheetsapp.jsapp/javascripts

Brunch はこれを という名前のフォルダーにビルドし、publicスタイルは にpublic/css/app.css、コンテンツは に格納しpublic/index.htmlます。問題は、UnCSS の構成について何が間違っているのかということです。私の理解では、ビルドからの CSS 出力で機能するということです。その場合、パスは正しいようです。

2014年からほぼ同じことを尋ねるSOに関する質問がありますが、回答はありませんでした。

0 投票する
1 に答える
2867 参照

html - テキストがブートストラップ 4 カードから流れ出します

ブートストラップ 4 カードの左右に 2 つの単語を配置しようとしています...

ただし、問題は次のとおりです。 ここに画像の説明を入力

カード本体から「チョロ」の文字が流れ出て…

これが私のコードです:

custom.css コードは次のとおりです。

私は何を間違っていますか?カード内に別のコンテナタグを入れても機能しません

編集

現在の外観: ここに画像の説明を入力ありがとう @GLP