質問編集履歴

2 修正しました coconut score 8 2018/06/29 17:36 投稿

画像の表示のようにするccsとhtmlを教えてください。

下記の画像のようにcssを指定したいのですが、

色々試行錯誤しているうちにおかしくなってしまいました。

枠の中の文字が上下左右中央になり、スペシャル判から下3行の文字を小さくするにはどうすればよいでしょうか？

お力を貸してください。

![イメージ説明](d3b4a3f009f182fadbcca19a0447930c.gif)

```html

\8,000

</div>

<div class="recommend_title">プリント料</div>

スペシャル判~~<br>デラックス判~~</div>

スペシャル判 \5,000<br>デラックス判 \6,000<br>ロイヤル判 \7,000</div>

```

```css

/*recommen-entry*/

.recommend-entry {

position: relative;

border: 1px solid #666;

margin:30px;

font-size: 30px;

padding: 3px;

width: 300px;

height: 150px;

text-align: center;

float:left;

}

.recommend_title {

position: absolute;

top: -10px;

left: 10px;

font-weight: normal;

font-size: 120%;

background: #fff;

padding: 0 .5em;

font-size: 20px;

line-height: 20px

}

```

上記のcssで今こうなっています↓

![イ![イメージ説明](43fbca2e6d940f6b988feacaf0fb8a7f.jpeg)

![イメージ説明](962bce349bfb26f223abae1af473c1ef.jpeg)

HTML

16983 questions

HTMLとは、ウェブ上の文書を記述･作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像･リスト･表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

11666 questions

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

1 現在の画像追加 coconut score 8 2018/06/29 17:00 投稿