HTML・CSS(15ページ目)

仕事やプライベートで自分でホームページを作成したいと考えた方。初心者でもわかるHTML・CSSの基本についての本やサイトを教えてほしい、ブロックレベル要素について教えてほしい等こちらに投稿して聞いてみましょう。

回答数

気になる

HP更新の仕事をしています。クライアントに、定期的にhtmlファイルのタイムスタンプの更新をお願い

HP更新の仕事をしています。クライアントに、定期的にhtmlファイルのタイムスタンプの更新をお願いされました。タイムスタンプ更新ソフトを使うつもりですが、1度webファイルを全てローカルに落とし、htmlファイルだけタイムスタンプ更新をし戻す作業が、大変手間がかかります。まるごと出来れば良いのですが、階下層の中にもhtmlファイルはあり、探して更新し、アップしなければなりません。何かやりやすい方法は無いでしょうか？ htmlファイルだけでもいろんな階下に合わせて100近くあり、間違えたらと思うと怖いのです。また、更新が必要な理由も、分かれば教えて頂きたいです。

質問日時: 2020/09/09 18:36 質問者: sorasora2010

ベストアンサー

2

1
コーディング中、右側に謎の余白が出現します

いつもお世話になっております。表題の件です。コーディングを順調に進めていましたが、途中で右側に謎の余白ができました。 cssで、position: absolute;を指定したら余白ができます。 cssでbackground-imageで画像を挿入し、画像の上にテキストを書いています。そのテキストを表示されるためにposition: absolute;を指定したところです。この指定がないと、テキストが画像の下に行ってしまいます。前にも同じような質問をさせていただきましたが、その時もposition: absoluteが入っていました。 position: absoluteをいれるとどうして余白ができてしまうのでしょうか？また、ネットで対策を色々と講じましたが解決できませんでした。どうぞよろしくお願いいたします。

質問日時: 2020/09/09 13:52 質問者: ハコ2222

ベストアンサー

4

1
サイトで、回り込みで文字を記載したいです。

<a href="https://px.a8.net/svt/ejp?a8mat=3BM3ZZ+B2B20Y+2QDO+NX735" rel="nofollow"> <img border="0" width="250" height="250" alt="" src="https://www27.a8.net/svt/bgt?aid=200905919669&wid=003&eno=01&mid=s00000012750004018000&mc=1"></a> <img border="0" width="1" height="1" src="https://www18.a8.net/0.gif?a8mat=3BM3ZZ+B2B20Y+2QDO+NX735" alt=""> ↑は、広告のコードなのですが、カンタンな説明を画像の右側に記載したいのです。 <div class="box"> <div class="box-img"> <a href="https://px.a8.net/svt/ejp?a8mat=3BM3ZZ+B2B20Y+2QDO+NX735" rel="nofollow"> <img border="0" width="250" height="250" alt="" src="https://www27.a8.net/svt/bgt?aid=200905919669&wid=003&eno=01&mid=s00000012750004018000&mc=1"></a> <img border="0" width="1" height="1" src="https://www18.a8.net/0.gif?a8mat=3BM3ZZ+B2B20Y+2QDO+NX735" alt=""> <div class="box-text"> テキスト<br> テキスト<br> テキスト<br> </div> </div> ↑のように記載してみたのですが、文字が画像の下に記載されます。お手数ですが、どのように記載するのか、ご教示していただけないでしょうか？

質問日時: 2020/09/08 11:16 質問者: naonaokeikei

ベストアンサー

2

0
HTMLとCSSに関して。ドロップダウンメニューの作り方を教えてください。

SoftBankGroupのウェブサイト（https://group.softbank/）のようなメニュバー（サイト左側の）を作りたいのですが、作り方が調べてもあまり分かりません。作り方がわかる方が居たら教えてくれると幸いです。よろしくお願いします。

質問日時: 2020/09/07 14:34 質問者: D2400

ベストアンサー

2

1
現在のホームページのトレンドはレスポンシブデザインorグリッド？他にありますか？

こんにちは、5年ほどWEB制作から遠のいているのですが、もう一度WEB制作を始めようとしているのですが、私が知っている技術はレスポンシブデザインがスタンダードでスマホにも対応できると思っているのですが、今でもデファクトスタンダードなのでしょうか？あとはJQUERYを使用したりしていました。教えて下さい。よろしくお願いいたします。

質問日時: 2020/09/05 15:54 質問者: ycqxs765

ベストアンサー

1

0
CSSのセレクタの記述方法について

下記HTMLがあるとします。 <ul> <li><a class="test" href="index.html">テスト</a></li> </ul> これにCSSを記述すると .test { color: blue; } テストと書いた文字が青くなります。疑問に思うのは、CSSで上記の方法と下記の方法ではどちらも結果が同じになると思うのですが、どちらが正しい記述方法とかあるのでしょうか。 ul li .test { color: blue; } 宜しくお願いします。

質問日時: 2020/09/02 18:31 質問者: 零礼

ベストアンサー

1

0
スマホサイトの構築 expression web4

スマホサイトを作りたいです。 expression web 4 を使っていますｐｃ用のページは散々作ったのでわかりますが、スマホ用のページも要は同様に作れるんですかね？新規作成で項目見たらスマホ用ページと言う項目が見当たりませんが他のフリーソフトのおすすめあれば教えて下さい。よろしくお願いします。

質問日時: 2020/08/31 08:43 質問者: takeyabeer

ベストアンサー

1

0
HTML表テーブルに文字を書き込みたい。

あるサイト内にある表テキストなのですが、見出しや2.3行目に書き込む文字をどこに入れたら良いのか分かりません。どなたか御教示頂けないでしょうか？ <div style="margin:0px;padding:0px;" align="center"><table width="98%" style="border-collapse: collapse;border:1px solid #000000;background-color:#FFFFFF;color:#000000;text-align:left;"><tbody><tr><th style="border:1px solid #000000;background-color:#808080;color:#FFFFFF;text-align:center;"> </th><th style="border:1px solid #000000;background-color:#808080;color:#FFFFFF;text-align:center;"> </th><th style="border:1px solid #000000;background-color:#808080;color:#FFFFFF;text-align:center;"> </th></tr><tr><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td></tr><tr><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td></tr><tr><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td><td style="border:1px solid #000000;text-align:center;"> </td></tr></tbody></table></div>

質問日時: 2020/08/29 08:46 質問者: chibi-babuu

ベストアンサー

2

0
サイトのセキュリティ上げたけどウェブに表示されない

こんにちはよろしくお願いします。サイト全体をhtts対応にしました。ずっと前に。でも検索結果ではｓついてないものばかりが表示され、ｓ付けたのに全然反映されません^o^; どうしたら反映されるのでしょうか？ sついてないサイトは削除する？その場合なにかデメリットはありますかやり方もわかりませんが。よろしくお願いします。

質問日時: 2020/08/28 09:39 質問者: takeyabeer

解決済

2

0
Ameba Ownd 電話番号へのリンクの貼り方

Ameba Owndでホームページの作成をしているのですが、「お問い合わせはこちらをクリック」をタップするだけで電話を掛けたりメールを送ったり出来る HTMLコードの書き方をどなたか御教示頂けないでしょうか？ちなみに、こちらのコードではリンク出来ませんでした。 <a href=”tel:090-5322-XXXX″ target=”_blank”>お電話でのお問い合わせはこちらをクリック！</a>

質問日時: 2020/08/23 14:11 質問者: makabeti

解決済

1

0
省略の点々

省略の点々には三点リーダーを用いるとこちらに書いてあります。 https://ja.wikipedia.org/wiki/%E7%9C%81%E7%95%A5%E8%A8%98%E5%8F%B7 上記のページでは、三点リーダー（つまり、点3つ）は文字の上下幅の丁度中央（丁度中間）に表示されています。しかし、htmlで三点リーダーを入力すると、確かに点が3つ表示されるのですが、文字の上下幅の下端に表示されます。つまり、「...」のように表示されます。文字の上下幅の丁度中央（丁度中間）表示されるようにするにはどうすればいいでしょうか。

質問日時: 2020/08/21 20:22 質問者: miho1994

ベストアンサー

4

0
グリッドレイアウトで"auto-fit"が効きません

説明では grid-template-columns:repeat(auto-fit, minmax(100px, 1fr)); のように記述するといくら画面を横方向に伸ばしても隙間なく埋められるようなのですが、添付画像のようにある程度伸びると止まってしまいスペースができてしまいます。 chromeとedgeの両方を試しても同様です。自分では以下のURLの画像のようにどこまで横方向に拡大しても隙間なくボックスができると思っていました。 http://up-img.net/img.php?mode=jpg&id=7477 記述が間違っているのでしょうか？ auto-fitについての考え方が間違っているのでしょうか？ auto-fitを使うと、親要素で余ったスペースは崩されて幅が0pxとみなされます。そのため1frの幅を持つグリッドアイテムで余ったスペースが埋められるんですね。 https://www.webprofessional.jp/difference-between-auto-fill-and-aut... （HTML） <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>グリッドレイアウト</title> <link rel="stylesheet" href="css/grid.css"> </head> <body> <div class="container"> <div class="box1">1</div> <div class="box2">2</div> <div class="box3">3</div> <div class="box4">4</div> <div class="box5">5</div> <div class="box6">6</div> </div> </body> </html> -------------------- (CSS) @charset "UTF-8"; body{ margin:0; } .container{ display:grid; grid-template-columns:repeat(auto-fit, minmax(100px, 1fr)); grid-template-rows:100px 100px; } .box1{ background:hsl(0, 60%, 60%); } .box2{ background:hsl(60, 60%, 60%); } .box3{ background:hsl(120, 60%, 60%); } .box4{ background:hsl(180, 60%, 60%); } .box5{ background:hsl(240, 60%, 60%); } .box6{ background:hsl(300, 60%, 60%); } 補足 repeat(auto-fit | auto-fill, minmax()) https://web.hazu.jp/grid-layout-02/ auto-fit では、各トラックは最小幅以上で、常に右側に空白ができないように伸縮します。 --- とありますが添付画像のように右側に余白ができてしまってる状態です。

質問日時: 2020/08/11 15:27 質問者: boulevard5

ベストアンサー

1

0
bootstrap4 の pagination を使って input して get する方法

bootstrap4 の pagination を使ってます。検索パラメータを保持したまま次のページを表示するため、form内のパラメータをinputしてgetしたいです。どうしたらいでしょうか？

質問日時: 2020/08/09 03:39 質問者: simarisu0812

解決済

1

0
flexboxで"flex-grow"と"flex-shrink"が混在している状態

添付画像がどのような状態なのか理解できません。 flex-growはflexコンテナが大きく余白があった場合、複数のflexアイテムをどの割合で伸ばして余白を埋めるか？と言うように理解しています。 flex-shrinkはコンテナが大きくアイテムがコンテナに収まらない場合、各々のflexアイテムをどのくらいの割合で縮めるか？というように理解しています。ここに出てくるflex-basisはコンテナ内のアイテムの基本的は幅だと解釈しています。添付画像のＣＳＳ".box1"に”flex-grow:1;”が設定されていますがこれだけなら意味がわかります。box2やbox3は幅を変えずにbox1のみ幅を伸ばして余白を埋めたと考えられます。が、ここに何のために ”flex-shrink:1;”が設定されているのかわかりません。幅を伸ばしているのに、何のために"flex-shrink:1;"をつけて縮めようとしているのでしょうか？ flexプロパティの基本的な部分かと思いますが自分には理解できません。分かる方いらっしゃいましたら初心者にわかるように教えてください。よろしくお願いいたします。

質問日時: 2020/08/08 13:29 質問者: boulevard5

ベストアンサー

1

0
NAVERまとめをダウンローダーで読み込んだのですが、記事の2ページ目からはpage=2となるはずな

NAVERまとめをダウンローダーで読み込んだのですが、記事の2ページ目からはpage=2となるはずなのにpage=1#となり、読み込んでくれません。どうしたら読み込めますか…？

質問日時: 2020/08/07 20:40 質問者: つばめ3434

解決済

3

1
誰か助けてください！！ NAVERまとめをwebsite Explorerでダウンロードしようとした

誰か助けてください！！ NAVERまとめをwebsite Explorerでダウンロードしようとしたら記事の1ページ目しか保存されません！！！どうすればいいですか！！！

質問日時: 2020/08/07 00:22 質問者: つばめ3434

ベストアンサー

1

0
htmlで on off 未選択を表現する要素

htmlで on off 未選択　を表現したいんですが何か良い要素はないでしょうか？

質問日時: 2020/08/05 00:26 質問者: simarisu0812

解決済

1

0
Webサイトについての質問です

WPとかのサイトでURLを見ると、 sample.com/2020/08/03/ のようなURLで記事が見れると思うのですが、実際に/2020/08/03/のフォルダは存在しないですよね？フォルダが存在しなければ、普通は404が返ると思うのですが、なぜページが表示できるのでしょうか？仕組みを教えてください。 html,php,jsはわかります。

質問日時: 2020/08/03 18:56 質問者: yuma-trumpet

解決済

1

1
HTMLとCSSで、ここのスペースは何が間違っているのでしょうか？見辛くて申し訳ないですが、左が自

HTMLとCSSで、ここのスペースは何が間違っているのでしょうか？見辛くて申し訳ないですが、左が自分のコードで右が正解です。

質問日時: 2020/08/01 20:46 質問者: Chevrolet__

ベストアンサー

2

0
箇条書きcssのul liで一部のliにだけ項目の左側に画像をつけたい

<ul> <li>リスト01</li> <li>リスト02</li> <li>リスト03</li> <li>リスト04</li> </ul> このリスト02と04の冒頭（項目の左）に画像を付けて表示したいのですが、htmlとcssはどのように書いたらいいでしょうか。このようなイメージです。　リスト01 ☆リスト02 　リスト03 ☆リスト04 下記のようにしてみたのですが、画像が表示されませんでした。 <ul> <li>リスト01</li> <li class="starmark">リスト02</li> <li>リスト03</li> <li class="starmark">リスト04</li> </ul> li .starmark{ list-style-type:none; background: url(./images/starmark.png) no-repeat left center; padding-left: 35px; }

質問日時: 2020/07/31 23:44 質問者: sasatoto59

ベストアンサー

2

0
今日からHTMLやCSSを勉強してるのですが、これらを使って、文字のフォントを変えたり、背景に色を付

今日からHTMLやCSSを勉強してるのですが、これらを使って、文字のフォントを変えたり、背景に色を付けるのは理解しましたが、Wordとかで文字の色を変えたり、背景に色を付けたり出来るのは、css？を自動的に使って色を変えてるんでしょうか？

質問日時: 2020/07/31 22:33 質問者: Chevrolet__

ベストアンサー

2

0
(CSS)セレクタ―の組み合わせについて

セレクタ―に"＋"（プラス記号）を使い下記のようにCSSを記述しました。 p + p { color: orange } 下記の解説通り解釈すると<section>の後にある同じ階層にある３つのPタグの真ん中だけに”color:orange”が適用されるのではないでしょうか？ ”+”（プラス記号）を使ったセレクタ―の使い方が自分の中でうまく解釈できません。 ”～”（波ダッシュ？チルダ？記号）を使ったセレクタ―の組み合わせとうまく整理できません。 ”「~区切りだと後ろに続くもの」、「+区切りだとすぐ後ろだけ」というイメージですね。”とサイトに解説してありますが、一番下に記述したタグのように「+区切り」でもすぐ後ろだけがオレンジ色に変わるわけではありません。どなたかわかりやすいように解説していただけないでしょうか？よろしくお願いいたします。 ------------------------------------ あるサイトには以下のような説明があります。 https://saruwakakun.com/html-css/reference/selector ◯ + ◯ {〜} 「+」で区切ると、同じ階層のすぐ隣（後ろ）の要素にのみCSSが適用されます。使用例 (HTML) <p>適用されない</p> <p class="example">適用されない</p> <p>適用される</p> <p>適用されない</p> （CSS） .example + p { /*.exampleのすぐ後のpタグに対して…*/ color: orange; } ------------------------------------ https://saruwakakun.com/html-css/reference/selector 「~」で区切ると同階層の後につづく要素に適用されます。 r ▼使用例 <p>適用されない</p> <p class="example">適用されない</p> <p>適用される</p> <p>適用される</p> .example ~ p { color: orange; } /*.exampleの後のpタグに対して…*/ --------------------------------------------- <main> <h1 class="ttl info">Title</h1> <p>Hello, hello.</p> <section> <h1 class="ttl">Title</h1> <p>Hello, hello.</p> ●<p>Hello, hello.</p> <p>Hello, hello.</p> </section> </main> (CSS) p + p { color:orange; }

質問日時: 2020/07/31 14:14 質問者: boulevardofdream777

解決済

1

1
innerHTMLはcssの要素も抜き出しますか？

innerHTMLはcssの要素も抜き出しますか？

質問日時: 2020/07/31 09:38 質問者: silverwolf12

ベストアンサー

2

0
なぜHTMLのソースコードが無料で誰でも見られるのか？

こんにちは、プログラミングを独学しています。 Google ChromeでCTRL+Uを押すとソースコードが見られますが、なぜそれは見られるのでしょうか？ソースコードに著作権はないのでしょうか？ <!DOCTYPE html> <meta http-equiv="content-type" charset="utf-8"> <h1>イタリア語の音楽</h1> <iframe width="560" height="315" src="https://www.youtube.com/embed/7VEq-ASh98M" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </html> のようなものです（これは私が書いたソースコードです）。たしかそのソースコードをコピペしたら同じようなWebサイトが作れてしまうはずですが。

質問日時: 2020/07/29 21:11 質問者: honoka547

解決済

8

0
HtmlからPythonコードを実行する方法

唐突な質問ですが、HTML、JavascriptでローカールのCSVファイルを読み込みブラウザでグラフを表示しています。(Chart.js、要素canvasで対応) データを検索して表示するようにしたいので、一旦元データをSQLLiteに保存することを検討しています。 SQLLiteの読み書きはPythonで対応できそうですが、HTMLからPythonスクリプトの実行方法がよくわかりません。 Javascriptの場合は、Html内に　<script src="Java_Test.js"></script>　のように記載すれば良いですが、Python(xxx.py)の場合はどのように対応すれば良いでしょうか？ python -m http.server 9000で簡易的にサーバーを立てています。お手数ですが、御教示願います。

質問日時: 2020/07/29 18:03 質問者: shige_otk

解決済

2

0
HTMLで書いていたサイトが文字化けしました

HTMLで書いていたサイトが文字化けしました。Visual Studio Codeを使い、日本語で書いていて、おそらく文字コードが違うからだと思うのですが、<meta charset="">のところを何に設定したら文字化けしませんか？サイト http://honoka.iiyudana.net/

質問日時: 2020/07/29 15:21 質問者: honoka547

ベストアンサー

2

0
HTMLタグで画像が表示されない

こんにちは。 <img src="img/honoka547.png"> <h1>ciao</h1> <p>mi chiamo honoka</p> ここまでHTMLタグをVSCodeで打ったのですが、画像が表示されません。どうしてでしょうか？画像（honoka547.png）はC:\Users\（私の名前）\Desktop\MyPortfolio\imgに保存されていて、HTMLを打った文章（index.html）はC:\Users\（私の名前）\Desktop\MyPortfolioに保存されています。 <h1>ciao</h1> <p>mi chiamo honoka</p>の部分はちゃんと表示されています。ちなみに進捗はFFFTPを使い http://honoka.iiyudana.net/ にアップロードしています。

質問日時: 2020/07/28 16:28 質問者: honoka547

ベストアンサー

1

1
Notepad++のコメントの色を変えたい

HTMLとCSSの学習として、「Notepad++」テキストエディタを活用しています。　エディタの背景色はblackに変更できたのですが…、HTMLのコメントを記述したときのフォントカラーが紫色なので、別の色に変更したいのですが、方法が分かりません。どなたか？お分かりの方、お教えください。おねがいします。

質問日時: 2020/07/27 16:32 質問者: nao771916

解決済

1

1
manabulogサイトで！ドロップダウン、プルダウンどちらですか！？

https://manablog.org/ 以上は manabulogさんのサイトの一部の方式ですが！以下の方式のどれかに該当すると思いますか？・ドロップダウンメニュー・ドロップダウン・プルダウンリスト・プルダウンメニュー・プルダウンよろしくお願いいたします。

質問日時: 2020/07/26 03:58 質問者: Campus2

ベストアンサー

1

1
htmlについて

aタグを画像を含めchildクラスすべてにしようとすると画像が大きくなってしまいます。今書いてあるｃｓｓでaタグをchildクラス全体に与えたいのですが、どうすれば画像を大きくせずaタグを与えることができますか？ <div class="parent"> <div class="child"><a href="index.html"><img src="hoge.png" class="img"><p>あ</p></a> </div> <div class="child"><a href="index.html"><img src="hoge.png" class="img"><p>あ</p></a> </div> <div class="child"><a href="index.html"><img src="hoge.png" class="img"><p>あ</p></a> </div> <div class="child"><a href="index.html"><img src="hoge.png" class="img"><p>あ</p></a> </div> </div> 以下css .parent { background: lightblue; display: flex; } .child { background: lightgreen; width: 30%; margin:1%; justify-content:space-between; /* 追加 */ font-size:2vw; } .child>img { width:100%; } .child:hover { opacity: 0.6; filter: brightness(110%); } @media screen and (max-width: 800px) { .parent { flex-wrap: wrap; } } @media screen and (max-width: 400px) { .child {width:90%; background: lightblue; display: flex; border:1px solid #000; margin:1% auto; } .child img {width:40%;} }

質問日時: 2020/07/24 18:04 質問者: 9うい9p

ベストアンサー

1

0
HTML CSS JavaScript PHPをどの順番でやっていこうか迷っています。順番としては

HTML CSS JavaScript PHPをどの順番でやっていこうか迷っています。順番としてはHTML CSS → JavaScript → PHP のつもりなのですが、どの程度理解したら次に進むべきなのでしょうか。全体的に浅く学習してから、一つ一つ深堀していくのか、確実に一つ一つ完璧にこなしてから次に進むべきなのか。考えをお聞かせください。

質問日時: 2020/07/23 10:25 質問者: ナーー

ベストアンサー

3

0
ホームページを作成したいのですが、アドレスの語尾を.comや.netにしたい場合はお金がかかるのでし

ホームページを作成したいのですが、アドレスの語尾を.comや.netにしたい場合はお金がかかるのでしょうか？いくらくらいかかりますか？またそれは継続的にかかるものなのでしょうか？

質問日時: 2020/07/22 19:41 質問者: てるぺこ

ベストアンサー

1

0
htmlについて

すみません。HTMｌで質問です。このコードに画像をつけて、画面の縮小に合わせ画像も縮小したいのですが、どうしたらいいですか？内容のところに画像をつけたいです。 <div class="col_3"> <div> ここに内容 </div> <div> ここに内容 </div> <div> ここに内容 </div> <div> ここに内容 </div> </div> *, *:before, *:after { box-sizing: border-box; } .col_3{ width: 100%; display: flex; display: -ms-flexbox; /* IE10 */ flex-wrap: wrap; -ms-flex-wrap: wrap; /* IE10 */ } .col_3 > div{ width: 33.33333%; padding: 10px; } @media screen and (max-width: 960px) { .col_3 > div{ width: 50%; } } @media screen and (max-width: 480px) { .col_3 > div{ width: 100%; } }

質問日時: 2020/07/21 19:12 質問者: 9うい9p

ベストアンサー

2

0
html,css 全体的に真ん中寄せにする方法２

すみません、前と同じ質問になってしまうのですが、、どうしてもサイトの内容が真ん中寄せにできません。検証でみると、右側に謎の空間があります。これって中央寄せになっていないということですよね？わかりやすいかわかりませんが、画像を添付します。以前ここで教えていただいた時は下記でできたのですが、今回はできません。なぜでしょうか？ body { width: 100%; max-width: 1000px; margin-right: auto; margin-left: auto; }

質問日時: 2020/07/21 16:04 質問者: ハコ2222

ベストアンサー

4

1
フォトショップで背景を切り抜いた画像をCSSで使いたい

いつもお世話になっております。表題の件質問させてください。フォトショップで、「被写体のみ選択」で、写真の背景を切り抜きました。そのまま画像をjpgで保存し、htmlで添付すると、背景が白い四角い画像になってしまいます。この画像を背景を切り抜いた状態で使用することはできるのでしょうか？それができないと、テキストと背景のない写真が重なっているデザインなので、全体を画像として貼ることになりますか？（テキストごと画像として貼る？）その場合はグーグルの評価などはどうなのでしょうか。質問が多くて申し訳ございませんがよろしくお願いいたします。

質問日時: 2020/07/21 12:30 質問者: ハコ2222

ベストアンサー

2

0
htmlについて

htmlで質問です。 pcの画面では大きすぎるし、かといってｖｗを指定するとコンテンツの幅が非常に大きくなってしまうことがあるので、スマホの画面を基準の大きさに～ｐｘ以上の画面で表示する場合は端に余白をつけたいのですがどのように書けばいいですか？また、調べるときはなんと検索したらいいですか？

質問日時: 2020/07/20 17:12 質問者: 9うい9p

ベストアンサー

1

0
htmlについて

下記のコードを隙間なく、2列の2段重ねで表示したいのですがｃｓｓはどう書けばいいですか？ <ul><li><input type="button" class="btn" id="btn1" value="hoge"></li> <input type="button" class="btn" id="btn2" value="hoge"></li></ul> <ul><li><input type="button" class="btn" id="btn3" value="hoge"></li> <input type="button" class="btn" id="btn4" value="hoge"></li></ul>

質問日時: 2020/07/20 09:16 質問者: 9うい9p

ベストアンサー

2

0
html,cssの、display: flex について教えてください。

ロゴが左上にきて、右寄せのナビゲーションを作りたいです。下記、間違っているところをご指摘いただけないでしょうか。 cssで、navを横並びにして、右寄せにするところまではできたのですが、その後に .wrap{ display: flex; } と打つと、 justify-content: flex-end;　の右寄せが崩れて左に寄ってしまいます。 html --- <header> <div class="wrap"> <img src="ロゴ.jpg"> <nav> <ul> <li>いっこめ</li> <li>にこめ</li> </ul> </nav> </div> </header> css --- nav ul{ display: flex; justify-content: flex-end; } nav ul li{ list-style: none; padding-left: 10px; } .wrap{ display: flex; } 本やネットなど数時間調べてやってみましたができないので質問しました。よろしくお願いいたします。

質問日時: 2020/07/15 21:37 質問者: ハコ2222

ベストアンサー

1

0
FFFTPでの文字化け

2019年12月以来久々にFFFTPでアップロードしたところ、日本語が文字化けしてしまいました。ホストの設定で文字コードを色々と変更してみましたが変わりありませんでした。ふと<meta charset="shift_jis">を<meta charset="UTF-8">にしてみたところ、文字化けがなくなりました。今後は<meta charset="UTF-8">を使用する予定ですが、今までのデータは<meta charset="shift_jis">のままでいいのでしょうか？<meta charset="shift_jis">のままなのに文字化けしてないのも不思議です。どなたかこの謎の答を教えてください。宜しくお願いいたします。

質問日時: 2020/07/15 18:18 質問者: junjunjujujun

ベストアンサー

1

0
html,css 全体的に真ん中寄せにする方法

表題の通り、全体的に真ん中寄せにする方法を教えてください。 width:1000px; margin-right: auto; margin-left : auto; →これで真ん中寄せにできたのですが、これだと画面の大きさが変わるとテキストが切れてしまいます。そこで、 width:1000px; を width:100vw にすれば、テキストは可変され、切れる問題は解決するのですが、 margin-right: auto; margin-left : auto; これで真ん中寄せにならなくなってしまいました。全体のテキストを可変にしつつ中央寄せにする方法を教えてください。どうぞよろしくお願いいたします。熊谷育実

質問日時: 2020/07/13 12:52 質問者: ハコ2222

ベストアンサー

3

0
バナーのサイズについて

前回の質問では情報が不足だったようなので、HTML・CSSを記載させていただきますサンプルの上のように同じサイズのバナーが並んでいるうちの1個をハーフサイズにして並べたいのですが、可能でしょうか？実現可能なご教授をお願いいたします。 HTML <ul class="bannerArea container"> <li><a href="https://www.amazon.co.jp/" target="_blank"><img src="/images/amazon_01.jpg" alt="amazon"></a></li> <li><a href="https://www.google.co.jp/" target="_blank"><img src="/images/google_02.jpg" alt="google"></a></li> <li><a href="https://www.rakuten.co.jp/" target="_blank"><img src="/images/rakuten_03.jpg" alt="楽天市場"></a></li> <li><a href="https://www.yahoo.co.jp/" target="_blank"><img src="/images/yahoo_04.jpg" alt="YAHOO"></a></li> <li><a href="https://auctions.yahoo.co.jp/" target="_blank"><img src="/images/auctions.jpg" alt="ヤフオク"></a></li> ※ <li><a href="https://shopping.yahoo.co.jp/" target="_blank"><img src="/images/shopping_02.jpg" alt="YAHOO!!ショッピング"></a></li> <li><a href="https://www.msn.com/ja-jp" target="_blank"><img src="/images/msﾝ.jpg" alt="msn"></a></li> </ul> CSS .bannerArea { margin-top: 70px; display: flex; flex-wrap: wrap; } @media screen and (max-width: 767px) { .bannerArea { margin-top: 40px; } } .bannerArea li { width: 32%; margin-right: 2%; } @media screen and (max-width: 767px) { .bannerArea li { width: 48%; margin-right: 4%; } } @media screen and (min-width: 768px) { .bannerArea li:nth-child(3n) { margin-right: 0; } } @media screen and (max-width: 767px) { .bannerArea li:nth-child(n+3) { margin-top: 4%; } } @media screen and (min-width: 768px) { .bannerArea li:nth-child(n+4) { margin-top: 2%; } } @media screen and (max-width: 767px) { .bannerArea li:nth-child(even) { margin-right: 0; } } .bannerArea li a { display: block; } .bannerArea li img { vertical-align: bottom; width: 100%; }

質問日時: 2020/07/09 11:54 質問者: UBCD_USER_0025

ベストアンサー

2

0
html／css pの中に複数のdivが入ってしまうのはOKですか？

いつもお世話になっております。表題の件でまた教えてください。 p（テキスト）が複数行あって、それぞれフォントや色を変えたい時は、一行ずつ　divを入れることになるでしょうか？その度にclass名を変えていくしかないですか？他にもっといい方法があったら教えてください。 <section　class="schedule"> <div class=""> <p>○○</p> </div> <div class=""> <p>○○○○○○</p> </div> <div class=""> <p>○○○○○○○○○○</p> </div> <div class=""> <p>○○○○○○○○○○</p> </div> </section>

質問日時: 2020/07/08 20:56 質問者: ハコ2222

ベストアンサー

4

0
アプリを作りたいのでSwiftを学ぼうと思っております。また、webサイトを作りたいのでHTML→

アプリを作りたいのでSwiftを学ぼうと思っております。また、webサイトを作りたいのでHTML→CSS→JavaScript の順で学ぼうと思っております。 SwiftとHTMLではどちらが先に学ぶべきでしょうか？

質問日時: 2020/07/07 21:14 質問者: 39392020

ベストアンサー

1

0
CSS 中央揃えについて

ページの中央に文字を配置したいのですが、両サイドの要素の中央に合わせてしまいます。どうしたらページの中央に合わせられるでしょうか？イメージとしては画像の通りです。

質問日時: 2020/07/07 20:43 質問者: Jxvsre

ベストアンサー

1

0
<td > タグのスタイル

こんにちわ htmlのタグのスタイルの質問です。 <td colspan="6" rowspan="2" style="border: 1px solid black; padding: 0.2em; ;"> こんなhtmlのタグがあってスタイルのところの「 ;」がわかりません。参照文字なのでしょうか？なんなのでしょうか？文字に四角ののボーダーをつけるところなのですが、なんなのでしょうか？ ------------- ｜　鉛筆　｜ ------------- ------------------ ｜　消しゴム　｜ ------------------

質問日時: 2020/07/07 14:37 質問者: DarrylBolt

ベストアンサー

1

0
html／cssの、navを２段にする方法を教えてください

webデザイン初心者です。タイトルの通り、navを２段にしたいのですがうまくいきません。一行目：お問い合わせ、契約内容確認（右寄せ）二行目：ホーム　メニュー　などのいわゆる普通のナビゲーション部分（中央配置）です。お知恵を貸していただけますと幸いです。よろしくお願いいたします。

質問日時: 2020/07/06 10:08 質問者: ハコ2222

ベストアンサー

4

0
DTPデザイナーにLPの仕事依頼で迷ってます

初めまして。フリーでDTPデザイナーをしております。相談する専門の知人がおらず質問させてください。 DTPデザイナーとして紙媒体の依頼をずっと受けていたクライアント先からホームページ上の『LP』制作の依頼メールが来ました。（普段、メールにてチラシなどの依頼から入稿のやり取りをしてます）クライアント様はDTPもwebもデザインは同じようなものだと認識されているようで普段通り依頼して来られたのですが、私がwebデザインの知識がなくLP製作経験もありません。ラフに『ここはアコーディオンメニューにしてください』などあり（その意味さえ知らなかったのです）単に画像をデザインするだけなら出来ますが、コーディングやCSSの知識も必要だと思いますので全く経験のない私が今から必要最低限のwebデザインの勉強して作業するより、この場合はクライアント様に説明して仕事依頼自体を断るのが妥当でしょうか？納期は1週間程度です。もしくは、やってみると案外できるものなのでしょうか？想像がつかず質問させて頂きました。どうぞご意見よろしくお願いいたします。

質問日時: 2020/07/05 14:45 質問者: frozenv

ベストアンサー

6

0
１つのselect文の値を、２つのformで使いたい

１つのselect文の値を、２つのformで使いたいのですが、やり方がわかりません。 javascript を使わないと出来なそうが気はしていますが、具体的な方法がわかりません。よろしくお願いします

質問日時: 2020/07/03 16:24 質問者: usa3usa

解決済

2

0
WebページのHTML文には、一般的にVbCrLfコードは存在しない？

Windows10マシンのテキストエディタで某WebページのHTML文を編集すると、各行の最後にVbLfコードが入っていますが、VbCrLfコードは見当たりません。 WebページのHTML文には、一般的にVbCrLfコードは存在しないのでしょうか？ご存知の方、教えてください。

質問日時: 2020/07/02 12:12 質問者: Gorby

解決済

3

0
レンタルサーバーのグーグルフォントを設置する場合！

https://nelog.jp/download-google-fonts を参考にグーグルフォントを、レンタルサーバに設置する場合ですが CSSに以下としましたが、全く連動されません！？スマホとパソコンで閲覧するとそれぞれ違うフォントで表示され、そもそも、指定したフォントでは表示されません？何でしょうか？ @font-face { font-family: Noto Serif JP; src: url('MPLUS1p-Light.ttf') format("TrueType"); } a.evernote-arrow-box-link{ font-family: 'MPLUS1p-Light', cursive; font-weight:normal; } 以上よろしくお願いいたします。共感した 0

質問日時: 2020/06/29 07:01 質問者: Campus2

ベストアンサー

3

1

【プログラミング・Web制作】に関するカテゴリ

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

質問する（無料）

【HTML・CSS】に関するコラム/記事

弁護士が解説！あなたの声を行政に届ける「パブリックコメント」制度のすべて

社会に対する意見や不満、疑問。それを発信する場所は、SNSやブログ、そしてニュースサイトのコメント欄など多岐にわたる。教えて!gooでも「ヤフコメ民について」というタイトルのトピックがあり、この投稿の通り、...
弁護士が語る「合法と違法を分けるオンラインカジノのシンプルな線引き」

「お金を賭けたら違法です」ーーこう答えたのは富士見坂法律事務所の井上義之弁護士。オンラインカジノが違法となるかどうかの基準は、このように非常にシンプルである。しかし2025年にはいって、違法賭博事件が相次...
釣りと密漁の違いは？知らなかったでは済まされない？事前にできることは？

知らなかったでは済まされないのが法律の世界であるが、全てを知ってから何かをするには少々手間がかかるし、最悪始めることすらできずに終わってしまうこともあり得る。教えてgooでも「釣りと密漁の境目はどこです...
カスハラとクレームの違いは？カスハラの法的責任は？企業がとるべき対応は？

東京都が、客からの迷惑行為などを称した「カスタマーハラスメント」、いわゆる「カスハラ」の防止を目的とした条例を、全国で初めて成立させた。条例に罰則はなく、2025年4月1日から施行される。この動きは自治体...