問題タブ [zurb-foundation-5]

Zurb Foundation には、画面の解像度に応じて適切な画像サイズを自動的に選択するデータ交換ライブラリが付属しています。これは素晴らしいことです。ブラウザ ウィンドウのサイズを変更すると、画像が自動的に拡大/縮小されます。

ブラウザー ウィンドウの幅を変更しても画像の高さが変わらないサイト ( http://riotdesign.eu/en/など、zurb 財団の Web サイト自体など) を見たことがあります。私はこの効果を達成するのに苦労しています。これを達成するために人々が使用しているライブラリ、またはその特別な css 設定はありますか?

サーバーに Zurb Foundation のアイコンをインストールし、適切な CSS 宣言を他のすべてのアイコンよりも先にロードする最初のスタイルシートとして head に含めました。

サイトが最初に読み込まれるとき、アイコンは表示されません。代わりに、各アイコンの場所に 4 文字のボックスが表示されます。

サイト上の別の内部ページへのリンクの 1 つをクリックすると、アイコンが適切に表示されます (ホームページに戻ったときも含めて)。

これは、ブラウザに関係なく発生しています。最初のページ読み込み時に表示するにはどうすればよいですか?

私が使用しているコードは次のとおりです。

私は最近ジョイライドをいじり始めました。素晴らしいです。ただし、いくつかの主要な対応の問題があります。ブラウザのサイズを変更すると、ヒントの位置が変わります。たとえば、元の位置が「上」の場合、ブラウザのサイズを変更すると突然「下」に変わります。

私はどこでも解決策を探しましたが、なぜこれが起こっているのかを見つけることができませんでした.

この問題が発生したり、回避方法を知っている人はいますか?

前もって感謝します！

だから私はFoundationを使い始めました。とても素敵です。
また、「mailto:」フォームを作成するために、Foundation のカスタム「Radius Button」を使用しています。

基本的に、私がオンラインで見つけることができるのは、醜いデフォルトの HTML ボタン/ラベルだけです。
このボタンと Foundation の「入力ラベル」を使用して「mailto:」フォームを作成する方法はありますか?

以下は、すべて整理されたボタン/ラベルのソース コードです。

これまで Foundation を使用したことはありませんが、コードだけで答えがわからない場合は、これを既製の Foundation "プロジェクト" に実装できると思います。

とにかく、上の HTML をプレビューすると次のようになります。

センド&リセットを参照してください。それが私がそれを提出して私に送るために使用したいものです。

助けてくれてありがとう。

Foundation での block-grid の使用法を知っています。たとえば、2 行 3 列などの不均一な div を作成したいと考えています。左側の列には、各行に 1 つの div があります。右側の列にも同じことが言えます。中央の列には、2 つの行の全長に拡張される div が 1 つだけある必要があります。Foundation 5でこれを行うことは可能ですか?

既存のドロップダウン内に 2 番目のホバー ドロップダウンが必要なので、最初のドロップダウンを開いて特定のオプションにカーソルを合わせると、2 番目のドロップダウンを開く必要がありますが、そうではなく、最初のドロップダウンを閉じるだけです。

Foundation 5 でドロップダウンをネストするにはどうすればよいですか?

私のコード:

私は今半日グーグルで検索し、いくつかの解決策を試しましたが、何もうまくいきませんでした. 皆さんが私の最後のチャンスです:( 私はfoundation5を使って新しいウェブサイトを立ち上げました.モバイル版ではoffcanvasを使っています.offcanvasバーガーを置き換えるか、少なくともそれをアニメーション化しようとしています.すぐに使えるスタイルは、オフキャンバスを再び閉じるためにも使用できることを示していないため、実際にはユーザーフレンドリーではありません。

私はここのようなものを探しています: http://sarasoueidan.com/blog/navicon-transformicons/

私はすでにそれを試してみました

このようなボタンで

私が何をすべきか提案はありますか？

こんにちは、WordPress サイトにこのファウンデーション 5 ライブラリがあります。私のワードプレスファイルにはすでにFoundation 5ライブラリがあります。ファウンデーション 5 のクラスはうまく機能します。しかし、私の問題は、iveのクラスを持つ<ul>タグを内部に追加したときに、ブラウザのサイズを変更すると画像が機能しないことに気付きましたが、タグを削除してクラスを使用すると、画像は有効になりません。ブラウザのサイズを変更すると応答性が向上します。私の問題は、ブラウザのサイズを変更したときに画像の応答性が向上することです。どうすればこれを行うことができますか? 誰かがこのことを理解するのを手伝ってくれますか?どんな助けも大歓迎です。<div>medium-4 large-4 columns text-center<ul>medium-4 large-4 columns text-center

私は経験の浅いフロントエンド開発者です。現在、Require JS とSlick Carousel http://kenwheeler.github.io/slick/と一緒にFoundation 5.5を使用しており、小さい画像をクリックすると適切なスライドに移動します。 .

私が現在取り組んでいるページは次のとおりです: https://beyondtells.com/silex/new-sales?vero_id=1@1.com (クエリ文字列を保持しないと表示されません)

私が使用している Chrome では美しく動作しますが、Firefox/IE でページを表示したところ、正しく動作していないようです。カルーセル内の画像が縦に積み上げられており、プラグインが機能していないようです。

たとえば、Foundation 5 グリッドが使用するデフォルトの列数を 12 から 24 に変更したいと考えています。ここでF5グリッドのドキュメントページを見ました

https://foundation.zurb.com/sites/docs/v/5.5.3/components/grid.html

しかし、実際には詳細な指示はありません。私が見るのはこれです：

Sass で カスタマイズする ファイルで提供される Sass 変数を使用すると、グリッドを簡単にカスタマイズ_settings.scssできます。

SCSS

$row-width: rem-calc(1000); $column-gutter: rem-calc(30); $total-columns: 12 ;

コメントを外し$total-columns: 12 ;て絶対に変更すると、$total-columns: 24 ;何も起こりません。繰り返しますが、ここには詳細な手順が表示されていないため、これを正しく行っているかどうかわかりません。では、デフォルトの Foundation 5 グリッドが使用する列の数を変更する適切な方法は何ですか?