質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.47%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

0回答

530閲覧

htmlとcssで画像の位置と大きさ、文字の位置を変えたいです。

takumi212

総合スコア65

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2022/03/23 20:16

編集2022/03/24 13:14

イメージ説明
htmlとcssのコードを書いています。2枚目の画像が現状で、1枚目の画像が設計です。
htmlとcssで画像に載せられている1枚目の画像の位置と大きさに変えたいのと、文字の位置を変えたいです。
どうしたらいいでしょうか?

※1枚目の載せられている画像ですが、横向きになってしまっています。すみません。

イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

sgru-

2022/03/23 22:36

スクショ等を載せて質問してくださるとわかりやすいと思います。
recal

2022/03/24 01:47

意図してそうゆう質問を繰り返していないのなら 知恵袋にいったほうが回答つくかもしれませんよ
mutsuki22

2022/03/24 05:27 編集

>htmlとcssで画像に載せられている位置と大きさに変えたいのと、文字の位置を変えたいです。 とある以上現場のコードがあるはずです。 コードによっては出来ない方法等もあるため、せめて現状のコードを記載して頂かないとアドバイスのしようがありません。
takumi212

2022/03/24 13:37

よろしくお願いします。 これがhtmlです。 `````````````````` <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>MyProfile</title> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <div class="left-box"> <img src="profilepicture.jpg" width="200" hight="266"> </div> <div class="right-box"> <!-- 1番目 --> <h3>プロフィール</h3> <hr size="10" style="background-color: black;"> <p>名前<br>住所<br>学歴</p> <!-- 2番目 --> <h3>Skill</h3> <hr size="10" style="background-color: black;"> <div class="skill-box"></div> <div class="skill-box"></div> <div class="skill-box"></div> <div class="skill-box"></div> <div class="skill-box">Word<br>Excel<br>PowerPoint</div> <!-- 3番目 --> <h3>MySite</h3> <hr size="10" style="background-color: black;"> <a targer=""> <a target=""> </div> </body> </html> ``````````````````` そして、これがcssです。 ``````````````````` style.css html, body, ul, ol, li, h1, h2, h3, h4, h5, h6, p, form, input, div { margin: 0; padding: 0; } body { font-family: "Avenir Next", "Hiragino Kaku Gothic ProN W3", sans-serif; } .li { list-style: square inside; } .left-box { width: 100%; height: 300px; position: relative; background: darkred; } .left-box:before { top: 0; left: 50%; width: 50%; height: 100%; content: ''; position: absolute; background: #e3d7a3; } ``````````````````````
mutsuki22

2022/03/25 01:29 編集

>takumi212さん 添付された物では流石に終着点がわからないです。 質問内容や書き方等でいろいろ注意されている事について思うところがあるようですが、ここの方々は遠隔で情報を貰っている赤の他人であり、成果物を直接みている先生等ではありません。 最低限アドバイス可能なレベルの情報を記載の上で質問してもらわないと答えられません。 質問内容等に関しては一旦許容したとしてもその辺りは意識しないと今後も回答はして貰えないと思います。 少なくとも自分は現状の情報では、前提として回答を【しない】のではなく【出来ない】です。
takumi212

2022/03/25 15:28

はい、現状のサイトの見た目は上に画像として貼ってあります。 そして、設計としては、横向きになってしまいすみませんが、私が構図を描いてあります。 ※私自身はこれを訓練として作成しているため、少しずつ進展していき分からなくなったらteratailやSlackの人を頼り、分からないところを分かるようにしているつもりです。
mutsuki22

2022/03/28 01:15

>takumi212さん 自分が平日の空いてる時間しか利用しないため、返答が遅くなってしまうのは申し訳なくは思いますが、再三言われてますが、同一とも取れる質問は辞めた方が良いとは思います。 人によっては回答する気力をなくしかねません。 因みに1点。 自分の書き方も悪かったかもしれませんが、自分は質問の内容が(この場合は完成図)わかりにくいので、その辺りを修正してもらいたいという意味で前回コメントしてます。
takumi212

2022/03/28 11:52

ご回答、ありがとうございます。思い通りにコードを書くのが進みました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問