2016-05-27 32 views
1

画面サイズが一定のサイズ(560px)になったら、htmlコードを少し編集したいと思います。異なる画面サイズでCSSのプロパティが異なる

<div id = "div"><span class = "span">Text<br>Right<br>Here</span></div> 

どのように私は私のCSSファイルを介してHTMLのこの行を編集することができています:任意のサイズ< 560pxで

<div id = "div"><span class = "span">TextRightHere</span></div> 

:任意のサイズ> 560pxで

+0

はありませんあなたはCSSでそれを行うことができないし。 – ksno

答えて

1

変更し、次のコード:次に

<div id = "div"><span class = "span">Text<br>Right<br>Here</span></div> 

、以下のCSSコードを使用します。

#div br{display:none;} 
@media screen and (min-width:560px){ 
    #div br{display:none;} 
}@media screen and (max-width:560px){ 
    #div br{display:inline;} 
} 
+0

本当にうまくいってくれました。 – CoopDaddio

2

あなたはできませんが、<br />は他の要素と同じようにdisplay:none;display:block;を受け取ることができます。

デフォルトではdisplay:noneを使用し、幅が狭すぎる場合はdisplay:blockを適用するためにメディアクエリを使用してください。

1

CSSでHTMLを変更することはできませんが、word-wrap: break-wordを追加すると、小さな画面にテキストを収めることができます。

+0

こんにちは、この半分しか私の問題を解決しません...私はどのようにしてテキスト、右、そしてここの部分が分割され、個々の文字ではないのですか? – CoopDaddio

+0

このソリューションを使用することはできません。 Niet the Dark Absolsソリューションを使用する必要があります。 – putvande

関連する問題