これで、画像、タイトル、説明、リンクなどでブートストラップカードを作成しています。説明の長さは50〜250文字であり、幅と高さが固定されています。だから私は説明の長さを取得し、フォントサイズを変更するためにifステートメントにそれをポップアップを考えていた。Javascriptの特定のタグにスタイル(フォントサイズ)を追加するには
font-size を特定の長さ以上の説明にちょうどに適用すると、問題が発生します。 HTMLは、関数内で形成されたのはここ
は次のとおりです。
card.innerHTML = "<div class='card'><img class='card-img-top' src='" + imgAddress + "' alt='Image'><div class='card-block'><h4 class='card-title'>" + title + "</h4><span class='desc'>" + desc + "</span><a href='" + linkAddress + "' download><button class='btn btn-primary'>View on our website</button></a>"+ addSpreadsheet + "</div><div class='card-footer'>Expires: "+ endDate + "</div></div>";
少し厄介なので、基本的に私達はちょうど
<span class='desc'>" + desc + "</span>
この行を必要とする私ができる方法はあります特定のスパンにIDやクラスを追加する私はカード全体のフォントサイズを変更しても機能しますが、明らかに動作しません。
詳細情報やコードが必要な場合はお知らせください。しかし、私はそれが十分であると思う。
<!--This p Tag contain 245 chars , We are going to limit it using javascript-->
<p id="desc">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui consequatur magnam facilis quas dignissimos voluptate tempore, reiciendis quidem quam fuga asperiores, blanditiis inventore modi assumenda maiores mollitia alias perferendis fugiat.
</p>
Javaスクリプト:私はあなたが
HTMLのための例を書く
私は状況のこの種では、文字列の固定長を使用します。 PHPやJavaScriptを使用して行うことができます。 PHPでsubstr()を使用して説明テキストを短くします。 – Niroshan
私は長い文字列を収容できる必要があります。より良いコードのために私が妥協することのできない状況。 – ImDone
それでは、テキストを制限せずに隠すことはできませんか?あなたのカードに 'more desc'ボタンを追加しますか? – Niroshan