ITmedia総合 >  質問!ITmedia  >  C

「CSS」最新質問一覧

Cascading Style Sheets
-こちらもご覧ください-
連載インデックス「いまさら聞けないCSS/スタイルシート入門」 - @IT
質問!Web Page Design→ITmediaのQ&Aサイト「質問!ITmedia」でWeb Page Design関連の質問をチェック

CSS
CSSのドロップダウンメニューについて
お世話になります。CSSについての質問です。添付の写真のようなメインナビゲーションのドロップダウンメニューについてですが、赤丸の下線の部分の白線の位置(ドロップダウンメニューのスタート位置)を下げるにはどう記述したらいいでしょうか?よろしくお願いします。.m...(2020/04/02)

CSS
CSS フッターのコピーライトが最下位に配置しない
フッターのコピーライトが一番下に配置していません。右側のウィジェットサイドのより下になりたいです。ボックスのはみ出しだと思うのですが、うまくいきません。教えてください。よろしくお願いしいます。http://yesdeafcan.com/(2020/03/31)

CSS
css -webkit-flex;の意味
ul { display: -webkit-flex; display: flex;} 上記のdisplay: -webkit-flex;の意味を教えてください。(2020/03/26)

CSS
css記述の再質問
画像を添付します。このようなことをcssでやりたいのですが。(2020/03/13)

CSS
css記述の続編
先日css記述の件で質問しましたが、また分からないことがありました。番号付きリストで括弧を使うとき、説明文が折り返したとき、頭を揃えるにはどうすればいいでしょう。(括弧は赤文字、他は黒)1.(1)説明説明説明説  明説明説明 (2)説明説明説明説  明説明説明説明...(2020/03/08)

CSS
cssの記述
1.(1)説明文1 (2)説明文22.説明文1などというふうにcssの箇条書きで記述するには、どうすればいいでしょうか。(括弧は赤文字)(2020/03/04)

CSS
blog CSSのタイトル色の変更指定について!!
このblog CSSのブログタイトルの色変更はどうすればいいですか?.blogtitle の所で色指定してもダメでした?他に方法があるのですか?livedoor Blog CSSFileName:ネコさん(20040819)Version:2006.06.26-----------------------------------------------------*/#header{}#...(2020/02/09)

CSS
WordPressの追加CSSの書き方
HPのタイトルの字の大きさを変更したい(レスポンシブ対応にしたい)ですが、調べて見つけたコードをそのままコピペすると、<や”などに赤の波線が引かれてエラーとなり、保存できません。対応する>や”を書いていてもです。どうすればよいかご教示願います。テンプ...(2019/12/02)

CSS
WordPress レスポンシブテーマのCSS
http://atsumare.wp.xdomain.jp/上記のURLでWordPressを使ってレスポンシブデザインの自作テーマを構築中です。クラス「glay」でくくったボックスがスマホだと本文に食い込んでしまって困っています。下記のものがスマホ用スタイルシートです。/**************************...(2019/10/04)

CSS
CSSは何故このような書き方をするんですか
何故多くの人たちがCSSを書くときdiv p { color: red;}のように改行やスペースを入れるのですか?div p {color: red; }でもいいと聞きますが、上のように書くメリットは何ですか?(2019/09/25)

CSS
追加CSSでサイトの編集をしようと思っているのです
追加CSSでサイトの編集をしようと思っているのですが、もともと青だった所を追加CSSを使用して赤に変更した場合、もともと書かれていた赤は無効になって追加CSSが優先されて赤になるのでしょうか?(2019/09/08)

HTML
CSS, Javascript読み込めない
Windows10のノートパソコンを使用しています。各ブラウザの設定は初期設定のままです。ローカル(PC内)でHTMLファイルにCSSファイル1つとJavascriptファイル1つを読み込ませ、Google Chrome, Microsoft Edge, Internet Explorerで開いたのですが、どのブラウザでもCSSもJava...(2019/07/14)

CSS
CSSでwidthの指定は%、pxどっちがいい
HTML5、CSS3の記述方法で教えていただきたい事がございます。横幅を指定する場合には、px、%、vwなどどんな単位で記述するのがいいのでしょうか。また、%とpxを混ぜて使ってもいいのでしょうか。高さも%を使うものでしょうか。お手数ではございますが、それぞれの説明サイ...(2019/07/03)

CSS
cssスタイルシート
(1)html { }と(2)html * { }の違いを教えてください。ちなみに使い方は下記のようなものでした。(1)html { font-family:sans-serif;}(2)html * {box-sizing: border-box;}どちらもhtmlタグ内すべての指定だと思いますがとくに(2)のアスタリスクがなぜ必要なのかがわかり...(2019/07/01)

CSS
FlexboxのレシポンシブCSSで困ってます2
Proof4さんスミマセン!再度質問させてください。教えて頂いた通りにしたらboxのレシポンシブ化は出来たので、infofl-item2にh3とリストを作成したらinfofl-item2のリストがh3の下に来なくて右横に来てしまいました。どこが悪いのかわかりません?お手数ですが教えて下さ...(2019/06/04)

CSS
FlexboxのレシポンシブCSSで困ってます。
Flexboxのレシポンシブの書き方で困ってます。各クラスのitemをPC版での場合は横並びで幅は20%、20%、60%。スマホ版では各itemが100%の画面横一杯に縦並びに表示したいです。他のCSSの関係上@media screen and (max-width:567px) の書き方は変えないでおきたいのですが...(2019/05/31)

CSS
CSS3のnth-childが上手くいかない
テーブル内のテキスト配置をtext-align: center;にします。左側の2番目以降をtext-align: left;にしたいです。どうやったら良いでしょうか?宜しくお願いします。(2019/05/20)

HTML
HTML css java php 開発環境
ネットで少し調べましたが、実際作業されている方に雰囲気を教えていただけると助かります。HTML cssはメモ帳で開発できますか?フリーソフトを使った方が作りやすいでしょうか?java phpは、ダウンロードが必要のようですが、この認識で合っていますか?会社のパソコンで...(2019/05/08)

HTML
menuのHTMLタグとCSSが上手くいかない
画像(1)が現状です。イメージは(2)です。何故HTMLタグを別々にするかというとスマホにしたらsubメニューをボトムに配置したいのです。メニューとsubメニューの背景がくっつかないのです。(1)を(2)にするにはどうすれば良いでしょうか?以下がHTMLタグとCSSになります。アド...(2019/04/14)

HTML
css javascriptについて教えて下さい。
下記のように、ボタンを押すとdivタグの中にpタグを表示するようにしました。そこで、そのpタグがdivタグの中央から表示するようにしたいのですが、できません。cssでpタグの左右のmarginをautoにするのかくらいしか思いつかず困っています。pタグがdivタグの中央から表示...(2019/01/31)

CSS
CSSが反映されない
以前にも質問させていただいたのですが、解決しなかったので、再度質問させていただきます。ワードプレスのCSSが反映されません。編集場所は子テーマのCSSです。最初に.headline2{background-color:#ffd700;}でダメで、こちらで質問させていただいたところ・・・・・...(2019/01/30)

CSS
ワードプレスで、CSSが反映されていないようです。
お世話になります。見出しに装飾をつけようと思い、ワードプレスのCSSを編集しました。が、反映されません。見出し2の背景色をゴールドにしようとしたのですが、ノーマル?のままです。ワードプレスのテーマは子テーマを選択し「Simplicity2 child: スタイルシート 」...(2019/01/23)

CSS
CSS 特定の文字列が入った要素を指定して処理
テーブルタグを使ったスケジュール表があり、「休憩」や「昼休み」という文字があったら、背景の色を変えるといったものをしたいです。スケジュールの時間により、「休憩」や「昼休み」の配置が変わってしまいます。なので、条件で背景の色を変えるようにしたいです。https...(2019/01/21)

CSS
cssでfont-styleだけ反映されない
chromeで確認しながらCSSを作成しているのですが、font-styleだけ反映されません。他のfont-weightやtext-decoration等は値を変更すると反映されるのですが、font-styleだけ何も表示が変わりません。ちなみに、IEで確認した所、italic等に設定していると反映されていること...(2019/01/20)

CSS
CSS テーブルタグの二列目にそれぞれ色を付けたい
http://takuya-1st.hatenablog.jp/entry/2013/12/05/035607これを参考にやってみましたが、何も反映されませんでした。ややこしくてうまくいけませんでした。テーブルタグ<table><tr><td>A</td><td>赤</td></tr><tr><t...(2019/01/18)

その他([技術者向] コンピューター)
このCSSで間違いがありますか?
下記のCSSで上手く認識しません。どこか間違いがありますでしょうか?お詳しい方宜しく願います。table.cal tr td{padding:2px; border-style:none;color:#575757;}tr.out{margin:20px 20px 10px 20px;text-indent:0em;font-size :12px;letter-spacing:0.2em;line-heigh...(2018/12/23)

CSS
リセットCSSがきかない
コーデイング超初心者です。HTMLとCSSでWEBサイトを作成していて、リセットCSSをコピペしたのですがきいていないようで、Chromeでは綺麗に反映されるのですがそれ以外のブラウザでは位置がずれて表示されます。YUI3やEric Meyer Reset CSS、HTML5 Doctor CSS Resetを使用し...(2018/11/13)

PHP
HTMLをWordPress化 CSSをどこに?
HTMLをWordPress化にするための勉強をしています。HTML側CSSヘッダー内<link rel="stylesheet" href="css/test.css"><link rel="stylesheet" href="css/test2.css">JSヘッダー内ではなく一番下</body>の前に配...(2018/11/12)

CSS
CSSの位置がPCによって変わる!!
現在、ド素人の身でWEBデザインの職業訓練校に通っている者です。課題でサイトを作っているのですが、学校のPCでは文字や画像やborderが綺麗に中央寄せになっているのに家のPCだと少し右に寄っていたり、寄りすぎて見切れているものもあります。画面のサイズが微妙に違うせ...(2018/10/30)

CSS
CSSで括弧の中に括弧
CSSの書き方で、括弧の中に括弧という記述方法はあるのでしょうか?例.itemList { padding: 10px 0; .itemList__item { float: left; }}ホームページにサンプルがあったので、テストしてみたら動作しませんでした。そもそもこういう書き方が認識されるのかが知りたい...(2018/10/23)

JavaScript
【js】特定の位置に来たらCSSを動作させる
jsの実装について質問です。画面中部の特定のdivまでスクロールしたら、そのdivにかかっているcssを動作させたいのですが、どのように記述すれば良いのでしょうか。例:divの背景を赤に変える。→初期の段階では背景色は白だが、任意のdivまでスクロールすると背景を赤に変...(2018/09/28)

CSS
CSSに追加した、footer記述が不完全か 
footer 部を下記の通りCSSに追加したが、画面の最大化では正常ですが、最小化にすると右に横ずれを生じ、どこを修正すべきか分からず解決出来きません。どうかご教示のほどお願いします。(例題を参考にして記述したものです。)html{position: relative; min-heig...(2018/08/17)

CSS
くの字点のcss
以下をcssにしてくの字点を出す方法を教えてください<span style="display:inline-block; line-height:1em; vertical-align:middle; -ms-writing-mode: rl-tb; -webkit-writing-mode: horizontal-tb; writing-mode: horizontal-tb; layout-flow:horizontal; text-o...(2018/08/09)

CSS
CSSで両端揃え
色はにほへど 散りぬるを我が世たれぞ 常ならむ有為の奥山  今日越えて浅き夢見じ  酔ひもせずこういう詩があったとして、「散りぬるを」と「常ならむ」を同じ幅にする、また「有為の奥山」や「浅き夢見じ」も「色はにほへど」と同じ幅にするにはどうすればいいですか?(2018/06/19)

HTML
CSS・HTMLのロールオーバーについて
テキストリンクにロールオーバーで任意の背景画像を入れるにはどうしたら良いでしょうか。cssにて:hover擬似クラスで背景画像を指示し、テキストリンクにカーソルを合わせると背景画像が表示されるところまでは出来ましたが、リンク毎に画像を変える方法はありますでしょう...(2018/06/07)

CSS
CSSでdivが縦にはみ出る問題
HTMLとCSSについての質問です<div class="wrapper"> <div class"first"></div> <div class"second"></div> <div class"third"></div></div>このようなHTMLがあります。その際...(2018/05/07)

CSS
商品枠の可変型の並ばせ方のCSSは?
DMMやヨドバシのサイトで商品を表示した時ウインドウのサイズによって、横に表示される商品の数が変化するCSSがわかりません。Divの枠にフロートで左詰めに並べると、枠幅に満たない余分が右にのみ出来て、商品群の中心がズレてしまいます。DMMやヨドバシなどの様にウイン...(2018/04/30)

CSS
cssのfloatについて質問です。
cssでfloatを使い3カラムで表示しています。クラスは左からleft,centre,rightと振っています。やりたいことはウィンドウサイズを縮めた時にカラム落ちするのではなく、rightのdivをlefr,centreの下に潜り込ませたいです。イメージ的にはleft,centreのz-indexが1に対し、rig...(2018/04/27)

HTML
CSSで画像郡のスライドショー
CSSを使って、画像を指定してスライドショーを行うものは様々参考になるものがあるのですが、画像一つ一つを指定せずに特定のフォルダを指定し、その中に格納されている画像を自動でスライドショーすることは出来るのでしょうか?もしその方法がありましたらご伝授いただき...(2018/04/17)

CSS
CSSでのpxをvwやvhに変換する計算方法
CSSでのpxをvwやvhに変換する計算方法を教えてください。(2018/03/20)

CSS
CSSのみでスライドショーを作りたい
CSSのみで自動で横にスライドするスライドショーを作りたいのですが、参考になるサイトはありますでしょうか?フェードイン、フェードアウトさせるスライドショーの作り方は沢山でるのですが、自動で横にスライドするスライドショーの作り方が載っているサイトが見当たりま...(2018/03/04)

CSS
例に挙げたcssの組み方は雑なのか
webデザイナーです。CMSで、管理画面上で登録した文章がhtmlとしてテキストで排出される、と言ったシステムを作っています。その骨組みになるhtml、cssを作っているのですが、・position:absoluteで文章位置を調整する・画像とテキストを横並びにしたら高さが揃わなかった...(2018/02/27)

CSS
css ドロップダウンメニュー
http://ri-mode.com/rainbow/2014/06/11/simple_css_dropdown_menu/上記のHPを参考にして、CSSでドロップダウンメニューをつくろうと試みましたが、上手く作動しません。どこが間違っているのでしょうか。〇Html文-------------<!DOCTYPE html><html lang="j...(2018/01/17)

CSS
CSS after before
.text{position: relative;display: inline-block;font-size: 2em;}.text:before{position: absolute;top: 1.3em;left: 0;content: "";display: inline-block;width: 0;height: 2px;background: #34BBF3;transition: 2s;}.text:hover:before{width: 100%;}このプ...(2017/11/30)

CSS
CSS 座標
.text{position: relative;display: inline-block;font-size: 2em;}.text:before{position: absolute;top: 1.3em;left: 0;content: "";display: inline-block;width: 0;height: 2px;background: #34BBF3;transition: 2s;}.text:hover:before{width: 100%;}このプ...(2017/11/30)

CSS
CSS サイト プログラム
https://qiita.com/junya/items/4805404624292401030dここにプログラムをコピペしてやってみたんですがサイトの通りに動きません。なぜでしょうか。このサイトが古いのでしょうか?誰か原因を教えてください。(2017/11/30)

CSS
プログラム CSS3 アニメーション
.text{position: relative;display: inline-block;font-size: 2em;}.text:before{position: absolute;top: 1.3em;left: 0;content: "";display: inline-block;width: 0;height: 2px;background: #34BBF3;transition: 2s;}.text:hover:before{width: 100%;}このプ...(2017/11/28)

CSS
プログラム CSS3 アニメーション
.text{ position: relative; display: inline-block; font-size: 2em;}.text:before{ position: absolute; top: 1.3em; left: 0; content: ""; display: inline-block; width: 0; height: 2px; background: #34BBF3; transition: 2s;}.text:hover:be...(2017/11/28)

CSS
CSS flexの指定で折り返した時の左寄せ
Flexの指定をしているのですが、思うようになりません。ぜひアドバイスをお願いします。スペースに収まりきらないものは改行させたいので、flex-wrap:wrap;折り返した行は、スペースを等しく開けたいので、justify-content:space-between;を記載しています。すると、最後の...(2017/11/16)

その他([技術者向] コンピューター)
<А>のCSSを一時クリアするHTMLないの?
<А>タグのCSSで文字の大きさを設定していますが、どうしても一箇所だけ文字を大きくしたい部分があります。style="size:"5"を入力しても駄目です。一時クリアするHTMLの記述はないのでしょうか?宜しく願います。(2017/11/13)



にわかに地球規模のトピックとなった新型コロナウイルス。健康被害も心配だが、全国規模での臨時休校、マスクやトイレットペーパーの品薄など市民の日常生活への影響も大きくなっている。これに対し企業からの支援策の発表も相次いでいるが、特に今回は子供向けのコンテンツの無料提供の動きが顕著なようだ。一方産業面では、観光や小売、飲食業等が特に大きな影響を受けている。通常の企業運営においても面会や通勤の場がリスク視され、サーモグラフィやWeb会議ツールの活用、テレワークの実現などテクノロジーによるリスク回避策への注目が高まっている。