CSS3に関連する質問一覧

新着
アクティブ
未回答
未解決
注目
解決済

解決済

回答

2
見出しタグが共通のCSSにある場合の下層ページのHタグの付け方

見出しタグの基本的な使い方について質問です。 H1がヘッダー、H2H3がフッターそれぞれサイトの全ページ共通のにある場合について（こちらは購入したテンプレートがそうなっているので変更できません。）下階層ページの作成をする場合は、見出しはどのように作成していけばよろしいでしょうか？タイトルをH1にして良いのか、それともH4から使うべきなのかまよっています。どうかご教授くださいm
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 70PV
m.ts10806 1時間前にコメント
解決済

回答

2
ホバーアクションについて

ボタンに右から左へ色が変わるホバーアクションをつけようとしています。右から左へ背景色が変わってボーダーもつくホバーアクションをつけたいのですが、ホバーを外してもとに戻る動作の時にborder-bottomのみ残ってしまいます。 .btn .eff-1にtopの位置を指定してもうまくいきません。（top:0px;、top:2px;、top:-2px;で試しましたがダメでした。.btnの高さ
- CSS3
- HTML5
- Webサイト
- 0評価
- 0クリップ
- 75PV
kumazou 4時間前にコメント
受付中

回答

2
a:linkが効かない

こんにちは。おたずねします。 a:linkが効かない場合の対処法を教えてください。初歩的な質問ですみません。よろしくお願いします。  <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>3-ホーム</title> <link rel="stylesheet" type="text/css" hre
- CSS3
- 0評価
- 0クリップ
- 75PV
itagagaki 5時間前にコメント
受付中

回答

1
【javascript 】IntersectionObserverで文字が表示されない

文字が順番に表示できるアニメーションを作成していたのですが見本と見比べてもどこが間違ってるのかわかりませんどなたかわかる方ご教授よろしくお願いいたします【HTML】 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=devic
- JavaScript
- HTML
- CSS
- CSS3
- SCSS
- 0評価
- 0クリップ
- 68PV
Lhankor_Mhy 5時間前に回答
解決済

回答

1
ヘッダー部分に余白ができており、余白を埋めたいのとjsのエラー原因を追究したいです。

前提・実現したいことヘッダー部分に上下左右に余白があるので、余白を埋めてすっきりさせたいです。ここに質問の内容を詳しく書いてください。ヘッダー部分に余白ができており、余白を埋めたいです。なぜ起きているのか分からず質問しました。発生している問題・エラーメッセージ .script.jsに以下のエラーが表示されています。・識別子またはキーワードを数値リテラルのすぐ後に指定することはで
- jQuery
- CSS3
- HTML5
- 0評価
- 0クリップ
- 84PV
free_teku 3日前にベストアンサー
受付中

回答

0
cssで画像を並べ、文字を任意の位置に置きたい(模写コーディング）

下記画像のようなコーディングをしたいのですが、どのようにすればいいでしょうか。ご教授お願いいたします。自力で理解できたのは以下の通りです。（HTMLはこのままで問題ないかと思われます） <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport" cont
- CSS3
- HTML5
- Visual Studio
- 0評価
- 0クリップ
- 63PV
teratailが 3日前にアップデート
解決済

回答

1
RoR CSSでbackground-imageが反映されない

railsのCSSでhtmlのdiv要素にclassをつけて、そのclassに対して .center-image{ background-image:url('/images/rimage/haikei.jpeg'); background-size: cover; } 上記のように記載するも　ChromeのコンソールではGET http://localhost:3000/images/rim
- Ruby on Rails
- CSS3
- 0評価
- 0クリップ
- 64PV
sanae0sanae 3日前にコメント
解決済

回答

3
FontAwesomeに「display: none」が効かない

タイトル通り「display: none」を指定しているにも関わらず、以下の画像の赤丸で囲った部分のようにFontAwesomeのメニューアイコンが消えずに困っています。これはProgateのレスポンシブデザインの演習で扱った物で、本来はPCで見た時は「display: none」で非表示にして、スマホで見た時に「display: block」で表示する、といったものです。しかし、それがロ
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 7123PV
hajini10 4日前にコメント
解決済

回答

2
HTML/CSS:文字の改行が理想通りになりません

2枚目のような改行をしたいのですが、 <p>Lorem ipsum dolor sit amet,<p/> <p>consectetur adipisicing elit, sed do<p/> <p>eiusmod tempor incididunt ut<p/> <p>labore et dolore magna aliqua. Ut<p/> <p>enim ad minim veniam,
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 116PV
maring 4日前にコメント
受付中

回答

1
自分の２つのサイトをリンクで移動した際に一瞬真っ白にならないようにアニメーションをきれいに実行する方法

「要約」:自分が運営している複数のサイトの上でのリンク移動の際に一瞬真っ白にならないような方法を教えて下さい。アニメーションがそのせいでうまく行かなくて困っています。 https://supercrowds.co/what/ このサイトで、左の「who we are」というボタンを押してみるとエフェクトが発生しながらアドレスが変わっているのがわかると思います。リンクをクリックするという動作
- HTML
- CSS
- jQuery
- CSS3
- HTML5
- 0評価
- 0クリップ
- 62PV
K_Arakaki 4日前に回答
解決済

回答

2
CSSで画像の折り返し方法がわからない

現在flex-wrap: wrap;を使用し1枚目の並びになりました。 2枚目のような並びにしたいのですが、どうすればよいでしょうか？ご教示お願いいたします。現状↓ こうしたい↓ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport" conte
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 90PV
maring 4日前に質問を編集
解決済

回答

1
疑似要素を使って、線を適切な位置に表現したい。

前提・実現したいこと疑似要素を使って棒線を作成したが、配置に困っている。発生している問題・エラーメッセージ現在の表示理想該当のソースコード <div class="view-more about-view-more"><a href="#" >私たちのこだわり</a></div> .view-more a { position: relative; } .view-
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 78PV
genjiro 4日前にコメント
解決済

回答

1
親要素liと子要素aを綺麗に均等に並べたいが、余白の設定がうまくいかない。

aタグに高さを持たせて、枠全体にリンクを貼るため、paddingを設定しました。親要素のliには設定していません。ただ、そうすると、余白が変なことになり（＝aでリンクを設定してあるところだけ余白が生まれるから）均等にメニューが並びません。かといって、親のliに同じpaddingを設定しなおすと、枠全体にリンクが反映されず、テキストだけになってしまいます。さらに、親と子に両方同
- CSS
- CSS3
- 0評価
- 0クリップ
- 112PV
hatena19 5日前にコメント
解決済

回答

1
模写コーディングCSSで画像の並べ方と文字の並べ方がわかりません。

下記の画像を模写コーディングをしたいのですが、画像の並び方と文字の並べ方がわからずに詰まってしまいました。元のソースコードはわからず検証も不可能な為、ご教授お願いいたします。現状はこちらです↓ 自力で理解できたのは以下の通りです。（HTMLはこのままで問題ないかと思われます） <!DOCTYPE html> <html lang="ja"> <head> <meta
- CSS3
- HTML5
- Visual Studio
- 0評価
- 0クリップ
- 81PV
itagagaki 5日前にベストアンサー
受付中

回答

2
【HTML/CSS】aタグのwidthおよびheightについて

下記のコードについて質問です。以下は、①aタグ内にdivタグを配置した場合、②aタグ内にimgタグを配置した場合、です。 aタグはdisplay:inlineの要素であり、widthの初期値はautoでheightの初期値もautoであり、内容物によってwidthとheightが定義されると思っていたのですが、検証ツールで調べたところ、想定と異なっておりました。参考サイト： https:/
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 236PV
Lhankor_Mhy 5日前に回答を編集
解決済

回答

1
cssでその場から動かない斜線のアニメーションを作りたい

cssで簡易的な斜線のアニメーションを作ったんですが、斜めに広がるときにその場にとどまらず上に上がってしまい困っています。 body{ margin: 0; } div { width: 300px; height: 1px; } .gradient3 { display: flex; position: absolute; top: 50%; left: 0;
- HTML
- CSS
- CSS3
- HTML5
- 0評価
- 0クリップ
- 86PV
hope_mucci 5日前にベストアンサー
解決済

回答

1
CSSでnot()が反映されない。

wordpressのCSSをカスタムしているのですが、特定のページにだけCSSを適用するためnot()を使用したのですが、反映されなくて困っています。アドバイスよろしくお願いします。 ↓CSSでサムネイル画像を特定のカテゴリーページにだけ表示したい。この場合は.category-22　のページのみサムネイルを表示したいので、ほかのページのサムネイルを display:none;にし
- CSS
- CSS3
- WordPress
- 0評価
- 0クリップ
- 129PV
spa 6日前にベストアンサー
解決済

回答

1
react gridで画面を分けたときにscrollできてしまう

reactとscssを使っています。 gridを使って横に三つ分けました。 heightを100vhにしているのに何故か縦にスクロールできてしまいます。わかる人いましたらご教授お願いしたいです。こちらがコードになります。
- HTML
- CSS
- CSS3
- React.js
- CSSフレームワーク
- 0評価
- 0クリップ
- 66PV
kakedashidesu 6日前に質問を編集
解決済

回答

1
floatで画像の位置に回り込みさせたいんですが、高さが合いません・・・

<div class="contents wrapper">  <main id="main_content"> <h2>青葉区のラーメン</h2> <div class="float_box"> <div class="men_list"> <a href=""><h3>ラーメンビリー</h3></a><img src="images
- CSS3
- HTML5
- 0評価
- 0クリップ
- 90PV
aisya 6日前にコメント
解決済

回答

1
ホームページの画像が切れてしまう・・・

前提・実現したいことホームページをレスポンシブ対応させたいです。発生している問題・エラーメッセージ画像が切れてしまい、1000px以下にになった場合に画像が切れてしまいます。。。該当のソースコード ```HTML＆CSS ソースコード @charset "UTF-8"; /*------------------------------ 共通パーツ -----------------
- CSS3
- HTML5
- 0評価
- 0クリップ
- 580PV
aisya 6日前にコメント