基本的な質問をする_html/css_WEB-ITnose-htmlチュートリアル-php.cn

ディスカッションに返信 (解決策)

ホームページ

ウェブフロントエンド

htmlチュートリアル

基本的な質問をする_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 am 11:51 AM

例えば、以下の内容を一行で表示したい場合はどうすればよいでしょうか？ (注: 1/2 は標準的な分数として上下 2 行で書く必要があります)
「...ここでは 30 文字省略してください...分数を入力したいのですが: 1+1/2, whatこれでいいでしょうか？...ここは10文字省略します...」

表を作りましょう。1行に数文字だけではもったいないし、レイアウトに影響します。もう少し絵を作りましょう。複雑。

注目してますか？

ディスカッションに返信 (解決策)

このアイデアを試すことができます

<!DOCTYPE html><html>	<head>		<meta charset="utf-8" />		<title></title>		<style type="text/css">			.percent{				position: relative;			}			.percent span:nth-child(1){				border-bottom: 1px solid #000;				position: absolute;				top: -2px;			}			.percent span:nth-child(2){				position: absolute;				top: 15px;			}		</style>	</head>	<body>		<div class="percent">			<span>1</span>			<span>2</span>		</div>	</body></html>

ログイン後にコピー

ブランチ p タグを使用します

ありがとう 2# ですが、私の ie8 は使用できません。

#1 の nth-child に感謝します (ie8 は使用できません)

ブランチは p タグを使用しています

例を教えてください。ありがとうございます。

実際、これは table を使用することで簡単に解決できます。 tr と td set valign="middle" は 1 つだけです。分数に遭遇した場合は、td を追加して
を使用します。問題 :p、table などはすべてブロック要素であり、別の行を占有する必要があります。行要素と同じ行に置くことはできません (インラインであっても、同じ水平行には存在しません)。表示する式が非常に短い場合 (1+1/2 など)、それも 1 行を占有し、あまりにも見苦しくなります。同じクラスにならない問題！センタリングは 1 つずつデバッグする必要がありますが、明らかに機能しません...

jslang へ:

あるいは、問題は 1/2 と 1/100 が同じクラスを共有できないことです。中央に配置するには 1 つずつデバッグする必要があります。明らかに機能しません...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title> new document </title><style type="text/css">#ft {	position: relative;	top: 0.5em;}#fb {	position: absolute;	top: -1em;	text-decoration: underline;}</style></head><body><br /><br />fffff 1+<span id="ft"><span id="fb">1</span>2</span> nnnnnnnnn</html></body></html>

ログイン後にコピー

わかりました。ポイントを追加して投稿します。月末です。皆様、明けましておめでとうございます。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。