-1

Fiddle - と の div がheaderありcontentます。ヘッダーは 1 行の短いもの、または 2 ～ 3 行の長いものです。コンテンツは非常に長くなる可能性があり、cutted.

残っている場所をすべて切り取る方法ですが、それ以上はありません。私はそれについてしばらく考えていましたが、「クリーンな」アイデアはありません。

4

2 に答える 2

0

改行を避けるために長いテキストをカットしますか? もし私がそれを手に入れたら、私はあなたが必要とすることをする簡単な例を作りました. フォントサイズに応じて CSS の高さを調整します。

<html>
    <style>
        /*header*/
        h2{
            height: 30px;
            overflow: hidden;
        }
        /*content*/
        div{
            height: 90px;
            overflow: hidden;
        }
    </style>

    <body>
        <h2>
            Vestibulum vestibulum faucibus metus vel sagittis. Vivamus quis venenatis arcu. Etiam ullamcorper lacinia justo ut tristique. Suspendisse orci tortor, auctor sed posuere nec, porta ac arcu. Nullam varius eleifend felis sed egestas. Mauris aliquam rhoncus risus, ut congue augue sollicitudin eget. Sed ullamcorper placerat eleifend. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce et tincidunt ligula. Integer malesuada ligula sit amet nulla dictum sed tincidunt elit scelerisque. Proin venenatis dolor hendrerit metus consectetur ornare. Nulla sed consectetur libero. Nunc feugiat fermentum enim, eget ornare lorem vehicula ac. Nam volutpat tortor a nisi interdum eu sagittis nibh dapibus. Phasellus aliquam ipsum nec sapien gravida auctor. Donec venenatis, magna ut tempus sollicitudin, nunc turpis lacinia metus, ac suscipit sem sem non nisi.
        </h2>
        <div>
            Vestibulum vestibulum faucibus metus vel sagittis. Vivamus quis venenatis arcu. Etiam ullamcorper lacinia justo ut tristique. Suspendisse orci tortor, auctor sed posuere nec, porta ac arcu. Nullam varius eleifend felis sed egestas. Mauris aliquam rhoncus risus, ut congue augue sollicitudin eget. Sed ullamcorper placerat eleifend. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce et tincidunt ligula. Integer malesuada ligula sit amet nulla dictum sed tincidunt elit scelerisque. Proin venenatis dolor hendrerit metus consectetur ornare. Nulla sed consectetur libero. Nunc feugiat fermentum enim, eget ornare lorem vehicula ac. Nam volutpat tortor a nisi interdum eu sagittis nibh dapibus. Phasellus aliquam ipsum nec sapien gravida auctor. Donec venenatis, magna ut tempus sollicitudin, nunc turpis lacinia metus, ac suscipit sem sem non nisi.
            Vivamus ac felis in sem scelerisque porttitor non non nunc. Cras quis ligula augue, non ornare felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis eu neque orci. Aenean sit amet lorem tortor. Vivamus et elementum nisi. Sed rhoncus, enim vitae tristique fermentum, purus metus pharetra tellus, non pulvinar orci lectus eget sem. Maecenas vel leo ac nulla aliquam varius id id felis. Maecenas eu vulputate lorem. Sed tincidunt est a turpis gravida pulvinar ac quis augue. Cras pharetra lorem nec arcu lobortis vestibulum. Pellentesque dapibus consequat egestas. Ut aliquam lorem eget risus dictum quis sagittis purus tempus.
        </div>
    </body>
</html>
于 2013-03-15T22:58:35.420 に答える
0

この正当化属性を cont クラスに追加します。

text-align:justify;
于 2013-03-15T15:57:23.487 に答える