[css] タグが付いた質問

CSS(Cascading Style Sheets)とは、HTMLやXMLをどのように装飾するかを規定する仕様。従来のHTMLを、「構造」と「体裁」を分離するために提唱された。CSSでは、各メディアに合わせて表示を変更することが出来るほか、デフォルトの状態から複数のプロパティを上書きしていくことも可能である。

86 未回答やベストアンサーなし質問
絞り込み
並べ替え
タグ付けされた
5
0 回答
176 閲覧数

Sassに複数の条件を適用する方法は?

[主旨] WebのプロジェクトでXMLからHTML5への変換を担当しております.世界各国語向けのCSSを生成しなければならないので、LTR/RTL(アラビア語、ヘブライ語)を分けて.scssファイルから.cssファイルをコンパイルして生成してます.今度更にコンテンツの製品のブランドをパラメータとして導入しなければならなくなりました....
tmakita's user avatar
  • 1,088
4
0 回答
160 閲覧数

Outlook2007/2010はHTMLメールのstyleブロック内のCSSを無視する?

HTMLメールのコーディングで困っており、質問させてください。 https://www.campaignmonitor.com/css/ こちらの情報によればoutlook2007/2010はhead内でのCSSの定義およびクラス名セレクタをサポートしているはずなのですが、以下のHTMLでは無視されてしまいます。 何か記述間違いなどありますでしょうか。よろしくお願いいたします。 <!...
html-mail-man's user avatar
3
0 回答
680 閲覧数

MonacaでボタンなどのコントロールのCSS変更

現在MonacaのボタンなどのコントロールのCSSを変更したいとおもっているのですが、反映されません。 jquery mobileをプロジェクトに追加前はCSSを変更できたのですが。 コードは以下のようになっています。 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <...
user12225's user avatar
3
0 回答
256 閲覧数

Masonryを使って画像を一覧表示すると左右にスペースができてしまう

Masonryを使用し画像を一覧表示しています。ヘッダーのサイズに合わせて画像を一覧表示させたいのですが、画像のように両サイドが余ってしまいます。 どのようにすればヘッダーにぴったり合わせることができるでしょうか cssだけであればぴったり表示されるのですが、masonry.jsを入れるとスペースができます。 読み込みの瞬間は正しく表示されます。(0.1秒くらいですが。。) css * {...
ccccc's user avatar
  • 49
3
0 回答
350 閲覧数

Rails アプリのCSSが効かなくなります。

Rails4で作成したアプリをHerokuにデプロイすると、CSSが効かなくなります。 デプロイした時はCSSが効いていても、数時間後あるいは翌日にアクセスするとCSSが効かなくなっています。これはどういうことなのでしょうか?ずっとこのような事態が続いています。 また効かないといっても完全に効かないというわけではなさそうです(99.5%のCSSは効いていませんが)。キャッシュの問題なのですかね?...
こうた's user avatar
2
4 回答
301 閲覧数

ボタンの中に斜めの線を入れたい

HTML, CSS初心者です。 添付の画像のように、斜め線が入ったボタンの実装をしようと思い、 実装サンプル集を参考に色々試行錯誤しましたが、斜め線をボタンの中に組み込む実装がうまくできませんでした。 cssサンプルをご提示いただけないでしょうか? よろしくお願いいたします。
mcu's user avatar
  • 21
2
0 回答
184 閲覧数

BEMのmodifierについて

以下のような、レイアウトが共通の色違い要素があったとします。(白黒白黒と続く想定) <div class="Block"> <div class="Block__element">白</div> <div class="Block__element">黒</div> <div class="Block__element"...
Aroma's user avatar
  • 121
2
0 回答
1,247 閲覧数

iOS11のtextareaでキャレットがズレるのをCSSだけで修正したい

iOS11のWebkitブラウザにおいて、モーダルウィンドウ内に配置した textareaのタップ時にキャレットの位置がずれる問題を修正したいと思っています。 下記1の対策は画面構成の事情で見送り、2の対策はエラー発生前から実装済みのため、 CSSで何とか解決できないかと模索しています。 親要素の position: fixed を position: absolute に変更すると直る説 ...
Yomo4M's user avatar
  • 21
2
0 回答
209 閲覧数

translate3d transition 終了時onメソッドについて

// 左にあるサムネイル4も左にスライドさせる $('#slider_thumbnail_4').css({   'transform': 'translate3d(-204%, 0, 0)',   'transition-duration': '0.5s' }).on('transitionend', function() {// transition終了時処理   $('#...
Nobumitsu Hata's user avatar
2
0 回答
233 閲覧数

pushPage後のcss変更タイミングを早めるには?

「Onsen UI最小限のテンプレート」を元に、2ページ間を前後に行き来するアプリを作りました。 それぞれのページに異なる画像を1枚ずつ貼り付けていて、page1.htmlのons-buttonのクリックでpage2.htmlに遷移した際に画像を50%に縮小して表示させたいのですが、私が書いたコードでは一旦100%サイズで表示してから一瞬遅れて50%で再描画されます。 pushPage後、...
PowerYOGA's user avatar
2
0 回答
958 閲覧数

Chromeで印刷したとき、Tableの行高さがおかしくなる

Tableタグで構成された表をChromeで印刷すると、tdの高さがランダムに倍になってしまいます。 <table> <tr> <td>名前</td> <td>住所</td> <td>電話番号</td> </tr> </...
masashi's user avatar
  • 21
1
1 回答
148 閲覧数

スマホからサイトを確認するとフォントが変更されていない

wordpressのaffinger5を使ってwebページを作成しました。 pcから開発者モードでスマホ用の画面で確認するとフォントは設定した通りに表示されております。 しかし、実際のスマホで確認すると機種を問わず、デフォルトのフォントになってしまいます。 なにかプラグインが影響していたりするのでしょうか? 2枚目がインストールしたプラグイン一覧です。 どうか、ご教示いただけると幸いです。
shinji's user avatar
  • 11
1
1 回答
125 閲覧数

ブラウザゲーム上で自作のドット絵フォントを表示する方法

HTML、CSS、JavaScript でドット絵のゲームを作ろうとしているのですが、相手のPCにないフォントを表示する方法がわかりません。ライブラリはp5.jsを使っていて、他にライブラリを使う予定はないです。
kakakaka11's user avatar
1
0 回答
2,732 閲覧数

iPhoneでのバウンススクロールを無効にするには

Ruby on Railsの練習でTwitterのようなサイトを作っているのですが、バウンズスクロールを無効にする方法がどうしてもわかりません。 MacOS(Chrome等)ではバウンズスクロールを無効化出来たのですが、iPhoneでのバウンズスクロールがどうしても出来ません。 html, body { overflow: hidden; } で個別の要素にheight: 100%; ...
user37422's user avatar
1
0 回答
201 閲覧数

electronで作成したPDFにCSSが適用されない

electronのWebContents.printToPdfのAPIを使って、バックグラウンドで非表示中のページをレンダリング後にPDF化したいです。 Angular2を使ってページを整形しているため、ngAfterViewInitのlifeCycleの後にPDF化を行おうとしたのですが、 PDF化したところ、一部のテキストがレンダリングされない状態でPDFが出力されてしまいました。 (...
横田直彦's user avatar
1
1 回答
211 閲覧数

FooTableの利用について

現在スマホ用の画面構築で、テーブルを可変にする為に FooTableを利用しようとしています。 以下のサイトを参考にしてます。 http://www.webantena.net/javascriptjquery/plugin-footable/ ところが、肝心のソースが手に入りません。 というのも、ここに限らずどのサイトでも最終的にGithubから ダウンロードするように誘導されますが、...
user17063's user avatar
  • 153
1
0 回答
552 閲覧数

HTML5 + Bootstrap + IE11 + Windows7にて、フォーカスを当てた時の挙動がおかしい

HTML5、Bootstrapにてページを作成しています。 IE11でテキストフィールドにフォーカスを当てた際に、謎の事象が発生しました。 1.枠線の影が消える 2.テキストフィールドの左上にグレーの影が表示される この現象は下記の環境で発生しています。 ・Windows7 Professional SP1(32bit) ・IE 11.0.9600.18537 (更新バージョン 11....
yasuyasu1515z's user avatar
1
0 回答
223 閲覧数

Monacaでposition:fixedを使用するには

お世話になっております。 Monacaでハイブリッドアプリを作成しております。 iOSの仕様 webkit-transparentが設定されている時 position:fixedが使用できず全てposition:staticになるため、 固定したいブロック要素が固定できずにいます(Android)では固定できています。 このような場合、どういった設定でブロック要素を固定すればよいのでしょうか?...
imgnation's user avatar
1
0 回答
240 閲覧数

Android4.3 以降のデフォルトブラウザでbackground-size:coverは使えない?

Android4.3ブラウザでbackground-size:cover;の適応が確認できなかったため質問させていただきます。 background-size:cover;と、background-size: auto 100%;を使って確認したのですが、適応されていませんでした。 GooglePlayから、GoogleChromeをインストールを行い確認したところ、適応されていました。 ...
名も無いWEB屋's user avatar
1
1 回答
459 閲覧数

MaterializeCSSを使用した場合にRailsのSelectボックスが動作しない

現在、以下の環境で開発を行っています。 Ruby:2.3.1 Rails:5.0.0 MaterializeCSSを使用しているのですが、Selectボックスがどうしても動かない状態です。表示はされるのですが、プルダウンできない状態になります。 調査すると、JavaScriptのコードを追加すれば解決するというものが多いのですが、JavaScriptのコードは追加済みで、...
ryu-yama's user avatar
0
0 回答
27 閲覧数

LaravelMix、LaravelVIteでMaterializeCSSのAutoInitがエラーになる

概要 Laravelでmaterializecss( https://materializeweb.com/ )を使いたいのですが、 エラーになります。 この解決方法がわかりません。 エラー内容 Uncaught TypeError: can't access property "AutoInit", ...
zenzenzenone's user avatar
0
0 回答
71 閲覧数

【ラジオボタンの選択保持】「送信」ボタンを押した後でも、選択保持をしているラジオボタンを制作したいです。

実現したいこと ラジオボタンの選択保持 前提 この質問はマルチポストです。 下記URLでも質問しています。 https://teratail.com/questions/9pkuzcnadxkgq6 プラグイン「WCFM」商品編集画面の「金額」の項目をテキストボックスからラジオボタンに変更しています。 「送信」ボタンを押した後でも、選択保持をしているラジオボタンを制作したいです。 ...
ryouhei's user avatar
0
1 回答
90 閲覧数

ボタンのhoverが効かない

hoverが効きません。 デベロッパーツールで、要素の状態を強制にすると適応はされますが 実際にカーソル当てるだけでは効きません。 また、.cartの要素をクリックしてもトップページに移動しないので .cart a:hoverやz-indexで手前にくるように指定なども試しましてみましたが、効きませんでした。 よろしくお願いいたします。 .cart { display: block; ...
pepe's user avatar
  • 39
0
0 回答
115 閲覧数

HTML内にscriptを記載して思っているようにしたいのですが、どうしても上手くいきません。どなたかご教授よろしくお願いします。

以下の四つの事が出来るようになりたいのですが、HTMLのタグの中のscriptタグの中にコードを書いてるのですがどうしてもどのようなコードを書けば良いかわかりません。 どなたかご教授ください。 1つ目:名前とニックネームを3回追記したらボタンを非表示(削除ではないのでDisplayではないとは思いますが)にし、それ以降は追記できない。 2つ目:tableタグとそれに関連するタグを利用し、登録した ...
kkoo's user avatar
  • 1
0
0 回答
137 閲覧数

HTMLでボタンの表示位置を変更したい

この時ボタンの位置を上にしたいのですがどのようにすれば良いでしょうか? ファイルフォルダ ├test.html ├video ├back.mp4 ├back.ogv ├back.webm └css __└setting.css /*============== 背景動画設定 ===============*/ /*header設定*/ #header{ position: ...
キャラメルマキアート's user avatar
0
0 回答
71 閲覧数

Visual Studio Codeで.scssファイルを作成および保存する際に、複数の.cssファイルが自動的に生成されるのを防ぎたい

VScode上でsassを使用したプロジェクトがあったため.scssに.cssから変更しコマンド+Sで保存したところ以下のような複数の.cssファイルが生成されました。 保存したファイル .global.scss 自動生成されたファイル .global.css .global.css.map .global.min.css .global.min.css.map ...
k_95.21's user avatar
0
1 回答
69 閲覧数

リンクの色がバックグラウンドと被って変えたい

リンクの色がバックグラウンドと被って変えたいです。 以下で color:skyblue になりません。答えていただける方よろしくお願いします。 <a style="color:skyblue;" href="https://www.salk.edu/">Sark Institute for Biological Studies ...
shin-Gplusplus097096's user avatar
0
1 回答
92 閲覧数

flexが効かない

均等に横並びに配置するために、下記のようにコードを書いたのですがflexが適用されません。もしこのコードをみて改善策がわかる方がいたら教えてください。  よろしくお願いします。 <nav class="global-nav_items"> <ul class="nav-list"> <li><...
rikkow4532's user avatar
0
1 回答
120 閲覧数

アコーディオンの開閉によって変わる高さをgsapに伝えたい

test1をスクロールに合わせて、画面内にでてきたらfadeInさせたいです。 ブラウザを読み込み、そのままスクロールするだけでしたら問題ないですが、 スクロールしたい要素の上にある.accordion-title 詳しくはこちら を開いた状態でスクロールすると、開閉により高さが変わり、test1がブラウザに出て来る前にfadein済みになってしまいます。 ...
pepe's user avatar
  • 39
0
0 回答
82 閲覧数

レスポンシブ対応のドロップダウンメニューがうまく作れません。

コーディング初心者です。レスポンシブ対応のドロップダウンメニューがうまく作れません。 どこを直せば添付した画像の通りSP版PC版整ったかたちになるでしょうか? $(function(){ // ハンバーガーメニュー $("#drawer_toggle").click(function(){ $(this).toggleClass("...
nhtgc's user avatar
  • 1
0
0 回答
87 閲覧数

prismjsで、コードを行ごとに交互色で表示したい

prismjsで、コードを行ごとに交互色で表示したい。 試したこと ・オプションを見たのですが、見つかりませんでした。 ・prismjs実行後のhtmlソースコードを見たのですが、(少なくとも見た目上は行単位ではなく)<code><span></span><span></span><span></span><...
re9's user avatar
  • 6,422
0
0 回答
77 閲覧数

JavaScriptでこのLoader作れますか?

Willstyle.co.jpのヘッダーの要素を塗りつぶすローダーの作り方をご存じの方は教えてください。 自分が考えるに登録された要素に操作をかけているのだと思うのですが()
Sou's user avatar
  • 1
0
0 回答
97 閲覧数

リキッドレイアウトにする際remでのレイアウト

初めて質問させていただきます。 コーディングの勉強をしています。まだ2か月ちょっとしか勉強もしておらず、見当違いな質問になってしまうかもしれませんが教えていただけると嬉しいです。 リキッドレイアウトを作成中です。これまでvwで作成していましたが初めてremでのコーディングにトライしています。htmlで以下のコードを指定していれば、...
muimui's user avatar
  • 1
0
0 回答
54 閲覧数

ログインフォームの自動補完を選択後の自動遷移について

ログインフォームの自動補完を選択すると自動遷移する現象があるのですが クライアントから自動補完は残していいのですが自動遷移を止めて欲しいと希望があるのですが どのようにHTML,CSS、JSなどで対策できますか? 現在は、Wordpressにて利用しているのでいいアイディアや参考になるサイトなどがあればご教授いただければ幸いです。 OSレベルの問題かと思っているのですが、、、
Kou Amano's user avatar
0
1 回答
370 閲覧数

table内のborderの太さがバラバラになるバグ

Laravel, Bootstrapを使用してwebサイトの画面を作成しています。 table内のborder(罫線)の太さが画面サイズを変更するとバラバラになってしまうブラウザ側のバグがあるようです。ブラウザの問題なのですが、この現象が起きないよう対応してほしいという要望があり苦戦しております。 100%以外の拡大/縮小で不規則に発生します。 Google Chrome, Microsoft ...
KeiOTN's user avatar
  • 1
0
1 回答
1,270 閲覧数

CSS Modulesの'composes'がVSCodeにてUnknown propertyと表示され有効化されない

とある教材でWebサイト構築を勉強中なのですが 表題の通り'composes'を記述しても 「Unknown property: 'composes'css(unknownProperties)」と表示されてしまいます。 教材の完成版のコードを読み込んでも同じエラーが出るので VSCode上の設定に問題があるのかなとは考えております。 海外のサイトで検索してみても'composes'...
wbwebwb's user avatar
0
0 回答
67 閲覧数

Chromeで閲覧している任意URLのhtmlタグに対して、なるべく簡単に「html{font-size:0.1em!important;}」を追加したい

現状 ・Chromeで任意URLを閲覧 ・右クリック後検証ページ開いた後、新規CSSルール追加 html{font-size:0.1em!important;} やりたいこと ・毎回追加するCSSルールが同じなので、もっと簡単に(閲覧時のみ適用される)CSSルールを追加したい その他 ・元のソースコード自体には、変更を加えない前提です ・任意のURLに対してこちらの任意のタイミングで、...
re9's user avatar
  • 6,422
0
0 回答
179 閲覧数

リンクのアドレスを取得したい

拡張機能を作成しようとしています。 リンクを右クリックし、コンテキストメニューに追加した新しい項目をクリックしたときに、リンクのアドレスを取得したいです。 現時点では、右クリックをしたらコンテキストメニューに項目が追加されるようにはなっているのですが、クリックしたリンクのアドレスを取得する方法が分かりません。わかる方いらしましたら、お手数をおかけしますがよろしくお願いします。 現時点でのコードです↓...
yushi's user avatar
  • 3
0
2 回答
324 閲覧数

タブの中のボタンを横並びにしたい

タブの中にあるボタンを横並びにして見やすくしたいです flexとか、display: inline-blockとかやってみたのですができません ちなみに、余白はバラバラですが大丈夫です 具体的にどうしたらよいのかを教えていただきたいです html <!DOCTYPE html> <html> <head> <meta charset="...
Romi's user avatar
  • 1
0
1 回答
130 閲覧数

インデックス風のタブメニューを作りたい

小学生のタブのところに社会も入れたいのですが、入りません あと、中学生と高校生の所に理科が入ってしまっています これをどうにかしたいです <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link rel="stylesheet" ...
Romi's user avatar
  • 1
0
1 回答
451 閲覧数

アコーディオンメニューが意図した通り動作しない

ボタンを押すとアコーディオンメニューが開くようにプログラムを組んだつもりなのですが、うまく動きません。 .menu { max-width: 600px; } .menu a { display: block; padding: 15px; text-decoration: none; color: #000; } label { ...
Romi's user avatar
  • 1
0
0 回答
63 閲覧数

LP作成の効率的な方法が分からない

LPの制作方法がもっと効率的にならないか迷走し始めたため質問いたしました。 ■前提 私は現在LPを基本的なコーディングで作成しております。 そのためコーディングのみでLP作成をする際に、 何か別の方法(ツール)を使ったほうが効率的ではないかと考えました。 一例で恐縮ですが、今回の質問では下記のLPを作成した場合でご回答お願いいたします。 https://service.ourly.jp/ ■...
poyo's user avatar
  • 3
0
1 回答
208 閲覧数

sassを使いたいのですが、CSSファイルが自動生成されたりしません。

ワードプレスでサイトの制作をしています。 VSCでサイトを作成する場合、sassのファイルを制作すれば、 自動的にcssのファイルが制作されますが、 FileZillaではsassを作っても自動的にcssファイルが出来たりしません。 今までは、VSCでsassファイルを作り、 それで自動生成されたCSSファイルの内容をFileZillaに作ったCSSファイルにコピーしていたのですが、それでは、...
kkk's user avatar
  • 93
0
1 回答
164 閲覧数

Twitter の「検索結果に対応するツイート一覧」を React に埋め込む方法

お世話になります。 Twitter の検索結果に対応するツイート一覧を、できるだけ快適に React に埋め込みたいと思っているのですが、良い方法をご存じの方はいらっしゃいますでしょうか? 動作のイメージとしては、Twitter で hoge と検索した場合に、 https://twitter.com/search?q=hoge に対応する検索結果が描画されることを期待しています。 ...
yashim's user avatar
  • 1
0
0 回答
328 閲覧数

親要素にTransformを指定した場合の画面固定について

ウェブサイトの制作初心者、初質問です。 ページのヘッダーを画面の先頭にposition:fixedで固定していたのですが、 サイトがスマホのみのレイアウトのためpcでみた時は少し大きく表示したいとのオーダーがあり、 zoomプロパティはfirefoxで使えないためhtml要素にtransform:scale();を使って画面幅が768px以上の時は1.25倍で表示するようにしました。 @media ...
Azuver's user avatar
  • 1
0
0 回答
1,089 閲覧数

ハンバーガーメニューを開いている最中bodyはスクロールしない設定にしていたが、メニュー内のドロップダウンを開いた時メニュー内だけでなくbodyもスクロールしてしまいます

html、cssがすこし触れる程度でjavascriptは主にコピペで使用している初心者です。 スマホでハンバーガーメニューを作成した際、 メニューを全画面で開いた時に隠れているbody全体はスクロールしないようjQueryで設定していましたが、 メニューの中身がドロップダウンで開くようになるとbodyのスクロールが復活してしまいました。 ...
user51214's user avatar
0
1 回答
94 閲覧数

height: auto;で設定した範囲が、中途半端なところで途切れます。

画像のように height: auto; がすべての範囲に届きません。 今はタブレット用のデザインを作成しています。 下記コードになります。 <section class="section-article"> <div class="article"> <div class="article-...
kkk's user avatar
  • 93
0
0 回答
285 閲覧数

ピクセルパーフェクトの正しいやり方がわかりません。

ウェブデザイナー(コーディングもできる)を目指しています。 ピクセルパーフェクトが重要だと聞き、やり方を調べると、 XDやフォトショップの見本のデザインをスクショで撮り、拡張機能のパーフェクトピクセル、で当てはめて調節するやり方と、 XDやフォトショップの数値通りにデザインするだけでもピクセルパーフェクトというようだとわかりました。 どっちがほんとうのピクセルパーフェクトのやり方なのでしょうか? ...
kkk's user avatar
  • 93
0
1 回答
191 閲覧数

WordPressプラグインの「CustomFieldSuite」に挿入した値をパーマリンクに設定したい

WordPressプラグインの「CustomFieldSuite」を使用したサイトを構築しています。 カスタム投稿はCPTUIを使用し「merchandise」としていまして そこにCFSを適用して、「num」というフィールドを作成したのですが、そのnumフィールドに設定した値をスラッグにしたいのです。 例)https://xxx.com/merchandise/numの値 ...
aminasu's user avatar
0
1 回答
107 閲覧数

javascriptでフェードインさせたい

目標 htmlの74~87行の部分をスクロールして見えてきた時にフェードインさせることです。 ・Our Serviceが下に ・image/black.png が上に ・image/educure01.jp DXを推進するエンジニア育成  IT事業参入をご検討中の事業者様向けのサービスです。 が上に  faideinさせたいです。 問題点 一部設定してみました。...
駆け出し太郎's user avatar