htmlのcheckboxで質問です

質問

<form action=" " method="post">
<p>
<input type="checkbox" name="riyu" value="1"><img src="a.png">
<input type="checkbox" name="riyu" value="2"><img src="b.png">
<input type="checkbox" name="riyu" value="3"><img src="c.png">
</p>
<p>
<input type="submit" value="送信する">
</p>
</form>

のようにして、絵の左にくるチェックボックスの位置や大きさを変えたいのですが、cssとかでできるのでしょうか？できれば絵に重なるようにチェックボックスを持ってきたいのですが。
cssじゃない方法などもあるのでしょうか？よろしくお願いいたします。

回答No.2

ORUKA1951

一言で言うと、ユーザーインターフェースに関わる部分は変更してはなりません。
訪問者は、少なくともユーザーインターフェースは変わらないと期待しています。時々見かける、マウスポインターが本来のものと異なるサイトに行った時に、あなたは違和感を感じませんか？？
　すべてのユーザーが画像を読んでいる訳ではありません。かならずalt属性で具体的な内容を示しましょう。

　位置を変えるだけなら、属性セレクタ使って・・
form input[name="riyu"]{position:relative;left:30px;top:-10px;}
form input[value="3"]{left:40px;top:-5px;}

お礼

ありがとうございます。
UIを変更するのは考えないといけないですね

回答No.1

kamikami30

CSSで良いと思います。

Htmlは目印をつけるだけで、実際にデザインするのはCSSと言う認識で良いでしょう。

お礼

ありがとうございます。