マンガでよめる痔のこと・薬のこと

<ul><li>を使って横並びのメニューを作っています。項目が増えると横幅いっぱいになるためメニューが2行になるのですが、項目の途中で改行されて困っています。

│●リンクA ●リンクB ●リンクC ●リン│←ページ右端
│クD ●リンクE

項目の途中で改行せずに↓こうしたいと考えています。

│●リンクA ●リンクB ●リンクC    │←ページ右端
│●リンクD ●リンクE

リストタグを使わずに<br>で改行を入れる方法は使いたくありません。いい方法をご存知の方がいましたら教えてください。よろしくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

難しく考えすぎ。

単純に改行されたくなければ、幅固定が一般的だけど、文字数で幅がかなり違う場合には、ブロックにして li や a 内に限り改行禁止にする。

li{ display:block } が一般的。

あとは、アンカーの前後に文字が付属する場合なら
li{ white-space: nowrap; } li a{ display:block;}

こうやれば、
li や a を margin,paddingで調整。border で囲ったり background や color で色々出来る。
また、この場合、
ブラウザでフォントサイズのみを大きく変更された場合に、段落が増えるのでリンクメニューの順序も多少考慮し標準サイズで右側が短い文章の項目になるようにデザインも考慮しなければいけない。
    • good
    • 0
この回答へのお礼

なるほど。参考になりました。ありがとうございました。

お礼日時:2009/03/15 22:10

ユーザーが、フォントを大きくしようが小さなディスプレイだろうが確実なのは、liにwidthを決めること。


 IEを無視してよいなら、もっとスマートな解決方法があるのですがね。そうも行かないので・・
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>Untitled</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
ul#navi{display:block;padding:0px;margin:0px;}
ul#navi li{display:block;float:left;width:auto;list-style-type:none;text-align:center;}
ul#navi li+li:before { content: "| " }
-->
</style>
</head>
<body>
<h1>title</h1>
<h2>subTitle</h2>
<ul id="navi">
<li style="width:6.5em;">肩こりトップ</li>
<li style="width:6.5em;">肩こりって?</li>
<li style="width:10.5em;">女性に多い肩こり原因</li>
<li style="width:9.5em;">一般的な肩こり原因</li>
<li style="width:6.5em;">肩こり解消法</li>
<li style="width:10.5em;">肩こりの治らない理由</li>
<li style="width:15.5em;">肩こり解消・予防のための栄養素</li>
<li style="width:6.5em;">肩こりと頭痛</li>
<li style="width:15.5em;">ストレスからの肩こりと自律神経</li>
</ul>
</body>
</html>
注)ul#navi li+li:before { content: "| " }
の + と :befor、contentは、IEでは無視される。
    • good
    • 0
この回答へのお礼

とても参考になりました。ありがとうございました。

お礼日時:2009/03/15 22:10

基本どうしょうもないわね。



でもアイデアがないわけではないわ。

その1.
文字列の長さを考慮して幅を取り
改行位置を調整する。

その2.
Javaスクリプト等で記述する。
1行に3つずつ表示する、とか
面倒だけど文字列の長さを計算して
1行越えるようなら改行するとか。

ホントは<li>使わないのが一番面倒ないけど。
    • good
    • 1

元ソースがないのでなんとも言えませんね・・・


floatで処理しているなら普通項目の途中で改行されることは
ないと思いますが・・・
    • good
    • 1

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qulタグやliタグの中でbrタグは使えない?

完成したサイトなのですが…。
Dreamweaverにて開いて一応チェックすると、
「タグbrはur内では使用できません」との表示がでて驚いています。

<li>~</li>だけで自動的になされる改行だと、詰まって見えるのです。
だから、

<ul style="padding-left: 00px;">
<li>~</li></br>
<li>~</li></br>
</ul>

のようにして処理しております。ただ、これってSEO的にマズい、ということなのでしょうか?
どうか、ご存知の方いましたら教えてください。

Aベストアンサー

SEO(検索エンジン最適化)には無関係ですが、文法的には誤りです。
→10.2 順不同リスト (UL)、序列リスト (OL)、及びリスト項目(LI)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/lists.html#edef-UL )

<!ELEMENT UL - - (LI)+ -- unordered list -->
ulには、「li要素のみを一個以上もつ。」と書かれています。


<!ELEMENT LI - O (%flow;)* -- list item -->
li要素には、%flowをゼロ個以上もつ、終了タグは省略できる。

読み方は、3.3.3 要素宣言 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/sgmltut.html#h-3.3.1 )を参照すること

したがって
<ul>
 <li>・・・<br>
 <li>・・・<br>
</ul>
とは書けます。(HTMLの場合)
その場合、ブラウザは
<ul>
 <li>・・・<br></li>
 <li>・・・<br></li>
</ul>
と解釈します。(XHTMLはこう書かないとならない)

★もっと、はるかに大事なこと
「<li>~</li>だけで自動的になされる改行だと、詰まって見えるので」<br>を入れるは、HTML的には最大の間違いです。こちらのほうがはるかに重要!!
 構造とプレゼンテーションは区別すること。デザインのためにHTMLを書いてはなりません。
 2.3.2 アクセス性 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.3.2 )

スタイルシートで、
ul li{margin-bottom:1em;}
だけでよい。

SEO(検索エンジン最適化)には無関係ですが、文法的には誤りです。
→10.2 順不同リスト (UL)、序列リスト (OL)、及びリスト項目(LI)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/lists.html#edef-UL )

<!ELEMENT UL - - (LI)+ -- unordered list -->
ulには、「li要素のみを一個以上もつ。」と書かれています。


<!ELEMENT LI - O (%flow;)* -- list item -->
li要素には、%flowをゼロ個以上もつ、終了タグは省略できる。

読み方は、3.3.3 要素宣言 ( http://www.asahi-net.or.jp...続きを読む

Qメニューの横並びで改行されてしまう。

ul li を使用して、横並びのメニューを作成したいのですが、
最後の項目が、横に並びきれなくて、下の段に移ってしまいます。

border幅や、marginも計算してpxで指定しているつもりですが、上手くいきません(TдT)

何故ですかね?

HTML
<body>
<div id="wrapper">
<header>
<nav>
<ul>
<li><a href="#">about</a></li>
<li><a href="#">information</a></li>
<li><a href="#">party</a></li>
<li><a href="#">access</a></li>
<li><a href="#">contact</a></li>
</ul>
</nav>
</header>
<!-- /wrapper --></div>


CSS
#wrapper {
width: 985px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

nav ul {
list-style-type:none;
}
nav li {
float:left;
width:190px;
border: 1px #ffb366 solid;
text-align:center;
margin-right:5px;
}

ul li を使用して、横並びのメニューを作成したいのですが、
最後の項目が、横に並びきれなくて、下の段に移ってしまいます。

border幅や、marginも計算してpxで指定しているつもりですが、上手くいきません(TдT)

何故ですかね?

HTML
<body>
<div id="wrapper">
<header>
<nav>
<ul>
<li><a href="#">about</a></li>
<li><a href="#">information</a></li>
<li><a href="#">party</a></li>
<li><a href="#">access</a></li>
<li><a href="#">contact</a></li>
</ul>
</nav>
</heade...続きを読む

Aベストアンサー

<nav>要素を使われていることから、HTML5だと思います。その場合は、
<doctype html>
になります。これで、ほとんどのブラウザは標準モードで動作しますので、ブラウザによるレンダリングの差はなくなるはずです。
★HTML5では、原則として<div>要素は使いません。
【引用】____________ここから
Note:Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element leads to better accessibility for readers and easier maintainability for authors.
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[4.5 Grouping content — HTML5( http://www.w3.org/TR/2012/CR-html5-20121217/grouping-content.html#the-div-element )]より
 著者は、 他に適切な要素がないときなど、最後の最後の手段としてDIV要素を使うよう強く推奨する。DIV要素でなく適切な要素を使うことによって、読者にとってはアクセシビリティ向上に、著者にとってメンテナンス性の向上につながります。
 HTML4.01(1999年)でもすでに「DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するため( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )」と書かれていたのですから、<div id="wrapper">も好ましくはありません。
 この場合、<article>でしょう。なくても良いはずです。
 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 標準モードでは、サイズはpadding辺の内側です。
 ⇒8.1 ボックスの寸法(Box dimensions)( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/box.html#box-dimensions )
 リストは、各項目を字下げしてレンダリングするブラウザが多いのですが、それにpaddingを使用するかmarginを使用するかはブラウザによって異なります。
 この場合
nav ul,nav ul li{
list-style-type:none;
margin:0;padding:0;
}
とそれらを消してから、改めて指定すると確実です。

最近のように、スマホやタブレット、幅広ディスプレイと様々な端末が想定される場合、固定ではなくリキッドでデザインするほうが良いですし、楽です。

<body>
 <header>
  <nav>
   <ul>
    <li><a href="#">about</a></li>
    <li><a href="#">information</a></li>
    <li><a href="#">party</a></li>
    <li><a href="#">access</a></li>
    <li><a href="#">contact</a></li>
   </ul>
  </nav>
 </header>

header,section,footer{
 width:980%;min-width:640px;max-width:980px;
 margin:0 auto;
}
header nav ul,header nav ul li{
 list-style:none;
 display:block;
 text-align:center;
 margin:0;padding:0;
 line-height:2em;
}
header nav ul{font-size:5px;}
header nav ul li{
 display:inline-block;
 width:18%;
 border: 1px #ffb366 solid;
 position:relative;
}
header nav ul li a{
 display:block;
 width:100%;height:100%;
 text-decoration:none;
}
 ⇒ナビゲーションリストを様々にデザインしてみよう。( http://www.ichiya.com/WebService/Howto/sample/HTML/nav/navigation1.html )

<nav>要素を使われていることから、HTML5だと思います。その場合は、
<doctype html>
になります。これで、ほとんどのブラウザは標準モードで動作しますので、ブラウザによるレンダリングの差はなくなるはずです。
★HTML5では、原則として<div>要素は使いません。
【引用】____________ここから
Note:Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element l...続きを読む

QCSSでborderの長さを指定、または可変にしたい。

下記のように指定していますが、これだと横幅いっぱいに下の線が表示されてしまいます。

文字なりの長さ、または指定のピクセル数にしたいのですが、どのようにしたらよいでしょうか。

h3{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

Aベストアンサー

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよければ

<h3><span>××○○</span></h3>
のようにspanで囲い、スタイルをspanに対して指定する方法もあります。

h3 span{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよけ...続きを読む

Q「CSS」リストの2段組どのように組まれていますか?(同一カテゴリの場合)

リストの2段組ですが、皆さんどのように組まれていますか?

リストの項目が同一カテゴリーだった場合です。
例えば下記のような同一カテゴリー(花)の場合
・チューリップ
・あじさい
・たんぽぽ
・ひまわり
・すみれ
・パンジー

これを
=============
・チューリップ  ・ひまわり
・あじさい     ・すみれ
・たんぽぽ    ・パンジー
=============
のように表示させたい場合です。
投稿した後に表示がズレるかもしれませんが、
・ひまわり ・すみれ ・パンジー の頭は揃えたいです。

苦肉の策で下記のようなマークアップをしています。
<ul class="left">
<li>チューリップ</li>
<li>あじさい</li>
<li>たんぽぽ</li>
</ul>
<ul class="right">
<li>ひまわり</li>
<li>すみれ</li>
<li>パンジー</li>
</ul>
そして左右にfloatさせています。
ただ、これだとリストが途中で分断されてしまって
正しいマークアップとは言えないですよね・・・。

こういうケースって結構あるのでは、と思い、
色んなサイトを巡りましたが見つからず。

皆さんこういったケースの場合どのように組まれてますか?
いっそテーブルの方が良いのでしょうか?
項目は後から追加するものと想定してください。
(縦に可変していきます)

どうぞ宜しくお願いいたします。

リストの2段組ですが、皆さんどのように組まれていますか?

リストの項目が同一カテゴリーだった場合です。
例えば下記のような同一カテゴリー(花)の場合
・チューリップ
・あじさい
・たんぽぽ
・ひまわり
・すみれ
・パンジー

これを
=============
・チューリップ  ・ひまわり
・あじさい     ・すみれ
・たんぽぽ    ・パンジー
=============
のように表示させたい場合です。
投稿した後に表示がズレるかもしれませんが、
・ひまわり ・すみれ...続きを読む

Aベストアンサー

確かに下のソースだとIEで駄目でした・・・
以下の部分を追加してください。


.left {
width:251px;
float:left;
clear:left; /* ←追加する場所 */
}

Qリストの左余白の削除方法

<li>リストを作成した再に表示されてしまう、左余白部分を削除して、画面左に詰めたいのですが、上手く出来ません。
どなたかご教授頂けませんでしょうか?

=>CSS記述<=
ul li {
list-style: none;
margin: 0px;
padding: 0px;}

=>HTML記述<=
<ul>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
</ul>

Aベストアンサー

ul li {

の箇所を

ul {

にするだけ

Q
が二つ続くと間に改行ができてしまう

<ul>~</ul>について質問です。下記のようなソースがあるとします。

----------------ソース----------------
<h3>あいうえお</h3>
<ul type="aaa">
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
</ul>
<h3>あいうえお</h3>
<ul type="bbb">
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
</ul>
------------------------------------
と書くと、下のように表示されますが、
★★の部分に改行が出来てしまいます。
この改行を出さないようにする方法はないでしょうか?

----------------表示----------------
あいうえお

1.あああ
2.いいい
3.ううう
★★
あいうえお

1.あああ
2.いいい
3.ううう
------------------------------------

<ul>~</ul>について質問です。下記のようなソースがあるとします。

----------------ソース----------------
<h3>あいうえお</h3>
<ul type="aaa">
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
</ul>
<h3>あいうえお</h3>
<ul type="bbb">
<li>あああ</li>
<li>いいい</li>
<li>ううう</li>
</ul>
------------------------------------
と書くと、下のように表示されますが、
★★の部分に改行が出来てしまいます。
この改行を出さないようにする方法はないでしょうか?

------------...続きを読む

Aベストアンサー

普通に書けばこうかな

<style>
h3{
margin:0px;
}
ul{
margin-top:0px;
margin-bottom:0px;
}
</style>

<h3>あいうえお</h3>
<ul>
<li><span>あああ</span></li>
<li><span>いいい</span></li>
<li><span>ううう</span></li>
</ul>
<h3>あいうえお</h3>
<ul>
<li><span>あああ</span></li>
<li><span>いいい</span></li>
<li><span>ううう</span></li>
</ul>

Qul liのclass指定について

表示が上手くいかないのでお助け下さい。
ul liのliにclass指定をして、それぞれのclassに異なる背景画像を表示させようとしているのですが、
なぜかclass指定をすると画像が消えてしまいます。
class指定をしない状態ですと普通に表示されるのですが、別々の画像を表示させたいと思っているので困っています。
どなたか教えて頂けないでしょうか?

また、申し訳ありませんがとりあえず表示されれば良いだけなので
htmlやcssの記述に対する細かいツッこみは勘弁して下さい。

宜しくお願いします!


【html】

<div id="side">
<ul id="sidenav">
<li class="a"><a href="test.html">test</a></li>
</ul>
</div>

【css】

div#side {
display: inline;
float: left;
width: 178px;
margin-top: 20px;
text-align:center;
background:#fff;
}

div#side ul#sidenav {
list-style-type:none;
border: none;
}

div#side ul#sidenav li.a {
background:url(../common/side.gif) no-repeat left;
background-position: 6px 11px;
}

div#side li {
position:relative;
width: 165px;
height:40px;
padding: 1px;
margin: 5px;
text-align:left;
border: 1px solid #8c8c8c;
}

表示が上手くいかないのでお助け下さい。
ul liのliにclass指定をして、それぞれのclassに異なる背景画像を表示させようとしているのですが、
なぜかclass指定をすると画像が消えてしまいます。
class指定をしない状態ですと普通に表示されるのですが、別々の画像を表示させたいと思っているので困っています。
どなたか教えて頂けないでしょうか?

また、申し訳ありませんがとりあえず表示されれば良いだけなので
htmlやcssの記述に対する細かいツッこみは勘弁して下さい。

宜しくお願いします!


【html】

...続きを読む

Aベストアンサー

>class指定をしない状態ですと普通に表示されるのですが、
このスタイルシートの書き方はどうなってますか?

>div#side ul#sidenav li.a {
このセレクタの、background-positionを消してみるとどうなりますか?

Qcssで「下よせ」ってどうやっていますか?

フロートのレフト、ライトはいいとして、

あるボックス要素内(A)に異なるボックス要素(B)をいれます。
この(B)を(A)の一番そこにはりつかせたい時にどうすれば
最もよいのでしょうか?

いいアイデアをご教授ください。

Aベストアンサー

こんなのはどうかな?

position: absolute;
bottom: 0px;

QCSSでの

<ul><li>を使用して文章入れても、その文章が長いと改行した時に
文字の始まりから、表示できません。(<li>の背景に矢印等の見出しマークを使用)
見出しマーク+スペース+文字の始まり・・・で改行されても、2行めの始まりが1行目の始まりに合わせて設定する方法をご存じないでしょうか?
よろしくお願いします。

Aベストアンサー

ちょっと、目指している仕上がりがよくわからなかったんですが
text-indent(とpadding)で調整してみては

<style type="text/css">
ul{
list-style-type:none;
border:solid 1px black;
width:8em;
}
li{
border:solid 1px red;
padding-left:1em;
}
li.type2 {text-indent:1em;}
li.type3 {text-indent:-1em;}
</style>


<ul>
<li class="type1">未調整のリスト、一行目と2行目以降が揃います。</li>
<li class="type2">1行目だけ一桁後ろから始まるように調整した例。</li>
<li class="type3">2行目以降を一桁後ろから始まるように調整した例。</li>
</ul>

Qdisplay: inlineと自動的な折り返し

display: inlineで<div>要素を並べています。
<div>要素中の文字が中途半端に改行されてしまいます。
<div>要素にwhite-space: nowrap;を指定すると、全体が一行になってしまいます。(ウィンドウサイズによって改行されない)

大変お手数ですが、よろしくお願いいたします。


イメージ例:
アップル マイクロソフト インテル グー
グル ソニー ノキア

質問 グーグルを自動的に折り返しを禁止したいです。

Aベストアンサー

DIVは、HTMLに用意されている要素だけでは文書構造を示しきれないときに使用するものです。
「DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )」

例えば、アップル マイクロソフト・・・がその文書の中で、何であるかを示す適当なタグがない場合でちょっと特別扱いをしたいのでしたら・・、
<abbr class="makerName" title="Apple">アップル</abbr>、<abbr class="makerName" title="microsoft">マイクロソフト</abbr>、<abbr class="makerName" title="Intel">インテル</abbr>、<abbr class="makerName" title="google">グーグル</abbr>、<abbr class="makerName" title="sony">ソニー</abbr>、<abbr class="makerName" title="Nokia">ノキア</abbr>
とか・・・abbrは、略称や頭文字をマークアップするタグです。
あるいは、
<span class="mark">アップル</span>、<span class="mark">マイクロソフト、<span class="mark">インテル</span>、<span class="mark">グーグル</span>、<span class="mark">ソニー</span>、<span class="mark">ノキア</span>
あるいは、HTML5だと、他から参照される可能性のある語句(要素)を示す<mark>がありますから
<mark>アップル</mark>、<mark>マイクロソフト、<mark>インテル</mark>、<mark>グーグル</mark>、<mark>ソニー</mark>、<mark>ノキア</mark>
かも知れません。

 それをスタイルシートで
abbr.makerName{white-space:prewrap;}
span.mark{white-space:prewrap;}
mark{white-space:prewrap;}
と指定すれば良いでしょう。

CSS2.1のwhite-spaceプロパティの値は、
normal | pre | nowrap | pre-wrap | pre-line | inherit
です。

もちろん、DIVが「文書構造を示すために使われているのでしたら」
<div class="note">
 <p>パソコンメーカーには<span>アップル</span>、<span>マイクロソフト、<span>インテル</span>、<span>グーグル</span>、<span>ソニー</span>、<span>ノキア</span>などがある。</p>
 <dl>
  <dt>アップル</dt>
  <dd>
・・・【中略】・・・
でしたら、
div.note span{white-space:nowrap;}
ですむわけです。

 要は「折り返して表示したくない」と言うことは、それらの単語がその文書にとって何らかの特別な要素であるわけですから、HTMLのルールとして文書構造をマークアップしておかなければなりません。・・・決してデザインのためではありません!!!
 そして、「折り返して表示したくない」場合は、その文書構造に基づいて、これらのもテキストは折り返さないようにデザインするわけです。
★この基本をしっかり理解しておきましょう。

 

DIVは、HTMLに用意されている要素だけでは文書構造を示しきれないときに使用するものです。
「DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )」

例えば、アップル マイクロソフト・・・がその文書の中で、何であるかを示す適当なタグがない場合でちょっと特別扱いをしたいのでしたら・・、
<abbr class="makerName" title="Apple">アップル</abbr>、<abbr cl...続きを読む


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング