ウォッチ
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時：
Jijtmdp745j さん
･････添付している写真のhtml cssのコード･･･････
例えば、↓
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
body{background-color: #cf8;}
.wrap { margin:10px auto 30px; position: relative;
width: 1200px;
display: flex;
background:#fff; padding:0; gap: 20px;
border-radius: 40px;
}
.wrap .txt { padding: 56px 75px 134px 100px; }
.wrap .txt h3 { margin: 0 0 60px 0; text-align: center; }
.wrap .img { background:#ffd; }
.wrap .img img { width: 600px; height: 408px; padding: 0; vertical-align: bottom; }
.wrap:nth-of-type(even) { flex-direction:row-reverse; }
.wrap:nth-of-type(odd) .img { border-radius:0 40px 40px 0; }
.wrap:nth-of-type(even) .img { border-radius:40px 0 0 40px; }
</style>
</head>
<body>
<div class="wrap">
<div class="txt">
<h3>タイトル</h3>
<div>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>
<div class="img"><img src="https://oshiete.xgoo.jp/images/feeling/qjiro/pc/ … ></div>
</div>
<div class="wrap">
<div class="txt">
<h3>タイトル</h3>
<div>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>
<div class="img"><img src="https://oshiete.xgoo.jp/images/feeling/qjiro/pc/ … ></div>
</div>
<div class="wrap">
<div class="txt">
<h3>タイトル</h3>
<div>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>
<div class="img"><img src="https://oshiete.xgoo.jp/images/feeling/qjiro/pc/ … ></div>
</div>
<div class="wrap">
<div class="txt">
<h3>タイトル</h3>
<div>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>
<div class="img"><img src="https://oshiete.xgoo.jp/images/feeling/qjiro/pc/ … ></div>
</div>
</body>
</html>
-
-
- 0
- 件
-
No.1
- 回答日時：
コード例
https://developer.mozilla.org/ja/docs/Web/CSS/wi …
https://developer.mozilla.org/ja/docs/Web/CSS/he …
https://developer.mozilla.org/ja/docs/Web/CSS/ba …
https://developer.mozilla.org/ja/docs/Web/CSS/ba …
https://developer.mozilla.org/ja/docs/Web/HTML/E …
https://developer.mozilla.org/ja/docs/Web/CSS/pa …
https://developer.mozilla.org/ja/docs/Web/CSS/pa …
https://developer.mozilla.org/ja/docs/Web/CSS/pa …
https://developer.mozilla.org/ja/docs/Web/CSS/pa …
コードを書いてくれるサービスの例
https://www.adobe.com/jp/products/dreamweaver.html
https://ja.wix.com/website/design
https://www.lancers.jp/menu/browse/graphics_desi …
-
-
- 0
- 件
-
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！
似たような質問が見つかりました
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- Word（ワード） ワード。長い四角の中に文字を体裁良く入力するには。 2 2022/09/24 14:19
- HTML・CSS 検索窓とcssハックについて 3 2022/04/22 12:21
- 面接・履歴書・職務経歴書 履歴書の写真のサイズが合いません 証明写真機で履歴書サイズに指定し撮影したのに貼り付けてみたら上下左 5 2023/06/19 16:24
- Visual Basic（VBA） 【VBA】写真の貼り付けコードがうまく機能しません。 5 2022/09/01 18:43
- プリンタ・スキャナー エプソンのプリンターPX-1600Fについて質問です 2 2022/06/24 19:24
- JavaScript Cookieに保存されない 1 2023/12/26 18:45
- HTML・CSS CSS上での計算を行うためのルールについて教えてください。 3 2022/08/15 14:43
- 防災 【自衛隊のPX品のPXってどういう意味ですか？】 3 2022/07/02 13:12
- 楽器・演奏 電子キーボードのCASIO Privia PX-S1100 とPrivia PX-S1000のどちら 1 2023/07/31 20:56
このQ&Aを見た人はこんなQ&Aも見ています
-
性格の違いは生まれた順番で決まる？長男長女・中間子・末っ子・一人っ子の性格の傾向
同じ環境で生まれ育っても、生まれ順で性格は違うものなのだろうか。家庭教育研究家の田宮由美さんに教えてもらった。
-
こんなことてしますか？？
C言語・C++・C#
-
どちのほうがすきですか？
C言語・C++・C#
-
プログラミング ソースコード
その他（プログラミング・Web制作）
-
-
4
Gitについて質問。 クローンしたフォルダをコピーして、色々書き換えて、 さらにクローンして、そこに
その他（プログラミング・Web制作）
-
5
プログラミング、アーキテクチャ好きに質問です。 kotlinなどのMVVM、単方向データフローの考え
その他（プログラミング・Web制作）
-
6
mallocについて
C言語・C++・C#
-
7
プログラミング
その他（プログラミング・Web制作）
-
8
小学1年生の子です。塾に行かせるのは難しいので、自宅で学べたらと思うのですが、子供にプログラミングを
その他（プログラミング・Web制作）
-
9
VBAに詳しい方教えてください。
Visual Basic（VBA）
-
10
テーブルのセルデータを自動改行させずに、はみ出た部分は切り捨てたい
HTML・CSS
-
11
Pythonって何を意識した言語なんですか？コマンドライン？
その他（プログラミング・Web制作）
-
12
プログラミング言語の制作方法について
C言語・C++・C#
-
13
これの対応OSを教えて下さい。php-8.3.0-src.zip
PHP
-
14
コードを直していただきたいです。 以下のコードはネットで拾ったものをほんの少しいじった物なのですが、
Visual Basic（VBA）
-
15
これなにがちがうんですか？？
C言語・C++・C#
-
16
HTML入門でもう躓いてしまった。
HTML・CSS
-
17
ホワイトハッカー
その他（プログラミング・Web制作）
-
18
なんでブラウザでPHPを動かすためだけにOSにPython2(Python3)を入れて、C(GCC)
PHP
-
19
Webプログラムってネイティブアプリプログラムに比べて遥かに簡単すぎる気がするのですが気の所為ですか
その他（プログラミング・Web制作）
-
20
システムエンジニアの適正について
C言語・C++・C#
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
インラインフレームの表示位置...
-
CSSのtransform: translate(-50...
-
iPhone用のサイトの文字がずれ...
-
aタグに直接style=""で:hoverを...
-
ヘッダーの上にほんのわずかに...
-
ホームページビルダー 空白の...
-
<h1>タグの後の行間を詰めたい。
-
上部の余白を消すには？
-
HTMLフォームのSELECTの幅を一...
-
CSS(スタイルシート)で画像の縦...
-
コードを書いて下さい（ ; ; ）...
-
htmlでテーブル内にテキストボ...
-
エクセルでサイズに合ったもの...
-
Excel で等間隔で縦線を引きた...
-
<tbody>は何のためにあるんでし...
-
【エクセルVBA】シェイプのサイ...
-
CSS line-height が効かない
-
markdownでテーブルの罫線は、...
-
エクセルでサイズ指定でＰＯＰ...
-
【ホームページビルダー】表の...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
CSSのtransform: translate(-50...
-
コードを書いて下さい（ ; ; ）...
-
aタグに直接style=""で:hoverを...
-
インラインフレームの表示位置...
-
HTMLフォームのSELECTの幅を一...
-
<h1>タグの後の行間を詰めたい。
-
INPUT TEXT内の文字位置を指定...
-
なぜ左に寄っているの？
-
アップロードするサーバーによ...
-
端から端まで横線を引きたい
-
macとwindowsのレイアウト崩れ...
-
Formタグのブロックの高さについて
-
chromeだけbody直下に空白が開く
-
FireFoxで見るとブラウザの幅に...
-
CSSでh1とその下の文字との行間...
-
IE８ではtext-align: center;で...
-
css。横並びBOXに長文textを流...
-
text-alignの解除の方法
-
div align="center"のalignは旧...
-
<legend>で表示されるタイトル...
おすすめ情報
