ベストアンサー CSS4の変数はJSのように複数の式(プロパティと 2017/07/06 17:09 CSS4の変数はJSのように複数の式(プロパティと値)を入れることはできないのです消化? 一つしか入れられないのでしょうか? 複数まとめたかったのですが、utilityにするしかないでしょうか? みんなの回答 (1) 専門家の回答 質問者が選んだベストアンサー ベストアンサー t_ohta ベストアンサー率38% (5320/13882) 2017/07/06 18:10 回答No.1 現時点での仕様を見る限り単純な変数であって、配列やインスタンスのようなモノは無いようですね。 質問者 お礼 2017/07/06 18:21 配列がないので一つのプロパティしか入れられないのですね。 fontsize color をセットにして見出し用の変数が作れれば変数一つ指定すればいいので良いと思ったのですが、 このようなセットにしたい場合はutilityしか選択肢がないのが当分続きそうですね 質問者 補足 2017/07/07 22:19 margin:var(--a),var(--b),var(--c),var(--d); のようなことはできないのでしょうか? あくまで一つの値しか代入できないのがcssの変数なのですかね? 広告を見て全文表示する ログインすると、全ての回答が全文表示されます。 通報する ありがとう 0 カテゴリ [技術者向] コンピュータープログラミング・開発CSS 関連するQ&A jQueryでCSSのプロパティに変数を付与 javascriptで、ブラウザの種類を判別し変数prefix にfirefoxなら-moz-、webkitなら-webkit-を格納するスクリプトを作成しました。 jquery1.7にてCSSを操作する際に $("#hoge").css({ prefix + "animation-name" : "name", prefix + "animation-duration": "5s" }); と記述した所、構文エラーになってしまいました。 jQueryでCSSの値に変数を使用することはできるようですが、プロパティに変数を使用することは出来ないのでしょうか? jQueryのCSSで値に変数を使う方法 jQueryでCSSを設定する際、 $("div").css("プロパティ","値"); とすると思いますが、この値の部分に変数を利用することはできないのでしょうか。 何がしたいかというと、for文の中で乱数を発生させ、それを値として使いたいのです。 for(i=0; i<10; i++){ var num = Math.floor(Math.random()*100); $("div:eq(i)").css("width",num); } このように書いてみましたが駄目でした。 値に変数を使う方法はありませんでしょうか。 できない場合、このような方法(CSSの値に乱数を使う)を実現できる方法はありませんでしょうか。 JSの変数をphpに受け渡す JSの変数 var w の値を、phpに、$abc = w; に受け渡し、 printf($abc); 表示する方法について、 それほど、難しいことではないかと思ったのですが、 解決できず、質問にいたりました。 ネットワークエンジニアとは?技術職の未来を考える OKWAVE コラム JavaScriptでCSSのプロパティの取得 JavaScriptで要素ごとでそのブラウザで使えるCSSのプロパティの取得はできるものでしょうか? そのプロパティの取り得る値も一緒に取得できると嬉しいです。 もし、できるならやり方を教えてください。 外部jsファイルの変数に代入するには? 初心者ですがjavascriptについて質問です。 なんらかの値を外部ファイル内の変数に代入させることは可能なのでしょうか? うまく説明できませんが・・・ あるjsファイル内の文字をリンク先の外部jsファイル内の変数の中に入れたいです。 <例> abc.js の中にある文字列"○○○" ↓ abc.jaから <a href="xyz.js">にリンク ↓ xyz.js の中の var xxx ="○○○" に、したいのですが・・・説明が下手ですみません。 わかる方是非教えてください。 CSSのwhite-spaceプロパティについて CSSのwhite-spaceプロパティの意味がわかりません。まず、「半角空白、改行、タブ...msmssatさん CSSのwhite-spaceプロパティの意味がわかりません。まず、「半角空白、改行、タブ」という言葉が出てきますが「タブ」とはなんなのかがわかりません。 そしてwhite-spaceプロパティには、normal,pre,nowrapと3つの値があるようですが、その違いが何なのかがわかりません。 ネット上で調べたのですが、どのような違いがあるのかがわからないのです。 CSS初心者です。 是非、お知恵を頂きたいと思っております。わかりやすくご説明をお願いします。 なお、Webクリエイター上級試験の勉強を独学でしております。 そのために、ご協力ください。 大変恐縮ですが、よろしくお願いいたします。 JSのプロパティはなぜ下記のように''がいらない? JSのプロパティはなぜ下記のように''がいらないのでしょうか? 恐らく文字列ではないという理由なんでしょうが、文字列に初心者には見えます。 let person = { 'age': 20, }; プロパティが文字列でない理由を教えていただければ幸いです。 また、変数、オブジェクト、配列は再代入時にletを省略できますが、これは change 上書き。再代入の時はletはいらない。前に オブジェクトなどは宣言済みで、すでに存在するので、再宣言をして、再度作る必要はないという事でよろしいでしょうか。 つまり宣言をすることが作成することという事ですね。 例 let person = { age: 20, }; person.age = 16; また再宣言のlet省略と再代入が同じ見た目でこんがらがるのですが、 どのように区別できるのでしょうか? 初心者にもわかるように解説していただけるとありがたいです。 フォルダの変数について LINKやSCRIPTで .css とか .js とかのファイルを呼び出そうとしたいのですが、 そのファイルの格納フォルダを 拡張子で判断するような変数の使い方ってあるのでしょうか? たとえば print "<LINK rel="stylesheet" href="select_file/base.css" type="text/css" media="all">\n"; の 様に記述し 変数select_file には 'css'や'js'のフォルダ名が格納されていて 実行すれば <LINK rel="stylesheet" href="../css/base.css" type="text/css" media="all"> の様になる。 こんな便利な方法はあるのでしょうか? よろしくご教授下さい。 HTML5とCSSとJSの勉強順 Javaを始めて3週間ほどのプログラミング初心者です。 今までJavaをやってきたのですが訳あってHTML5とCSSとJSでAndroidアプリを開発する事になりました。 HTML5とCSSとJSのどれから始めるのが良いでしょうか? (今までやったことはありません) お勧めの入門書などあれば書いてもらえるとありがたいです。 よろしくお願いします。 CSSのfontプロパティについて CSSのfontプロパティについて fontプロパティでシステムフォントを設定できます。 例えば p {font:iocn} とかです。 ほとんどのところは次の6つが解説してあるようでした。 http://w3g.jp/css/font/font しかし、画面のプロパティを見ているとヒントとかも フォントを設定できるようでした。 ということは p{font:hint}とかもできたりしますか? 上記6つ以外で使えるという意見があれば教えて下さい。 jsがoffのときcssを適応させたい タイトル通りjsがoffのときのみcssを適応させたいのですが、offを検知し適応させる方法はありませんか? このように「:」を付けるcssは A:link { プロパティ: 値 } このように「:」を付けるcssは a以外にもあるのですか? AIは使う人の年齢や市場にも影響する?人工知能の可能性 OKWAVE コラム HTML+CSS+JSでのアプリ開発 HTML+CSS+JavaScriptでAndroidやiOSアプリを作る事は可能だと聞いたことがあるのですが、ネイティブアプリとHTML+CSS+JSアプリとではできることにどのような違いがあるのでしょうか?僕が今作ろうと考えているのは募金アプリですので、ネイティブアプリだと募金額の30%取られてしまうのであればHTML+CSS+JSで行きますが、有料アプリを出す気は無いです。長期的な事を考えたらJavaから入る方がいいかもしれないですね。あとWebページを作りたいって訳じゃ無くて、募金アプリだったらどっちの方が良いかってこととネイティブに対してHTML+CSS+JSでする事にどういうメリットどデメリットがあるのかって事です。長くなってしまいましたが、ご回答頂けると嬉しいです。よろしくお願いします。 cssは複数作る? こんにちは。 ホームページを自分で作成している初心者です。 ページがだんだん増えてくると、それにともなってcssの記述も多くなってきます。 そこで今はテーマやカテゴリーごとにcssを分けているのですが、cssもだんだんと増えてきます。 そもそもcssは複数作るものなのでしょうか。 そのことによる利点、欠点などがあれば教えてください。 よろしくお願いします。 CGI実行環境下の.jsや.cssが動きません 環境 OS:RedhatLinux ES3 WevServer:Apache/2.0.54 Perl 5.8.0 CGIを設置しているディレクトリのなかに、JapaScriptを書いている xxx.jsとスタイルを定義しているxxx.cssを置いているのですが、 CGIを実行すると、Apacheのエラーログの中に パーミッションが755だと (8)Exec format error: exec of '/hoge/xxx.css' failed, (8)Exec format error: exec of '/hoge/xxx.js' failed, パーミッションを666すると (13)Permission denied: exec of '/hoge/xxx.css' failed, (13)Permission denied: exec of '/hoge/xxx.js' failed, が出力されてしまいます。 もちろん、JavaScriptのエラーも出てしまいます。 .jsや.cssを正常に読み取らせるにはどのようにhttpd.confを 設定すればよいのでしょうか? ※ちなみに、CGIの実行を許可(ScriptAlias)していない ディレクトリでは.jsや.cssは正常に動いています。 条件式にcssの値を使う方法。 条件式にcssの値を使う方法。 下記の部分が謎なのですが、プロパティ == 値という形でなぜプロパティの値がnoneだった時となるのでしょうか? if( toolTip.css("display") == "none" ) $(function() { $(".tooltip").each(function(){ var toolTip = $('<div class="tooltip-body">'); var toolTipText = $(this).attr("data-tooltip"); toolTip.html( '<p>' + toolTipText + '</p><span class="tail"></span>' ).hide(); $("body").append(toolTip); $(this).hover(function(){ if( toolTip.css("display") == "none" ){ var targetPostion = $(this).offset(); var toolTipHeight = toolTip.height(); toolTip.css({ "position": "absolute", "top": targetPostion.top - toolTipHeight -3 + "px", "left": targetPostion.left + "px", "display":"block", "opacity": "0", "z-index": "9999" }) .stop().animate({ "top" : "-=10px", "opacity": "1" }, 250); } }); }); }); CSSのプロパティが一覧になっているウェブ CSSのプロパティが一覧になっていて、初期値が載っているウェブを探しています。 ご回答お願いします。 JSの変数について https://okwave.jp/qa/q9322322.html?by=agree#a_area の続き 確かにspeedBaseが変更されないと初期値が変わらないので 永遠にスピードが速くならないですね。 問題は下記のようにspeedを使っているので、speedBaaseとspeed変数の中身は同じなのに、 第二引数にspeedBaseという変数名であるとおかしいのでわざわざspeed変数に再代入しないといけない点です。 このような場合どう解決しますか? let speed = (speedBase = speedBase * 0.9); let setClickItem1 = setInterval(() => { let mathRandom = Math.random(); }, speed); >>> >speedBase++やspeedBase--の場合もグローバルになければクリックリスナーが終わればこの変数は消えてしまうのですね。 そのとおりです。 上記の演算式のパターンと比較して下さい、(ざっくりと言うと)「speedBase++」は「speedBase = speedBase + 1」と ほぼ等価、「speedBase--」は「speedBase = speedBase - 1」と ほぼ等価。 やはりグローバルにした時のみイベントリスナーが終わってもその中で宣言された変数は残り続けるのですね。 これは上のスコープであれば参照できるとは違うのですか? 参照はグローバルはもちろんどのスコープからでも参照できますがグローバルでない上にあるスコープなら 参照できますが、こちらはグローバル限定なのでしょうか? JS,CSS「みつどもえ」のマークを作れますか? JS, CSS「みつどもえ」のマークを作れますか? スキルアップのための問題を作りました。 CSSとJavaScriptで三つ巴(みつどもえ)のマークを作ります。 巴のマークをオタマジャクシの頭と尻尾に見立てた場合、 それぞれをどのように作りますか? <仕様> 1. 大円の直径を100px、小円1つの直径はその46%の長さ。 2. CSSとJavaScriptのコードだけで作成する。 3. Canvas、画像、jQuery等のプラグインは用いないこと。 <HTML> <div class="wrapper"> <div class="container"></div> </div> CSSの基本的な形 CSSを指定するとき、 セレクタ□{プロパティ:□値;} のような形になると思うのですが(□はスペース)、このスペースが 、 セレクタ□{□プロパティ□:□値□;□} だったりしても通用すると思うのですが、正しい書き方はどのような形なんでしょうか? 回答よろしくお願いします。 注目のQ&A 「You」や「I」が入った曲といえば? Part2 結婚について考えていない大学生の彼氏について 関東の方に聞きたいです 大阪万博について 駅の清涼飲料水自販機 不倫の慰謝料の請求について 新型コロナウイルスがもたらした功績について教えて 旧姓を使う理由。 回復メディアの保存方法 好きな人を諦める方法 小諸市(長野県)在住でスキーやスノボをする方の用具 カテゴリ [技術者向] コンピューター プログラミング・開発 Microsoft ASPC・C++・C#CGIJavaJavaScriptPerlPHPVisual BasicHTMLXMLCSSFlashAJAXRubySwiftPythonパフォーマンス・チューニングオープンソース開発SEOスマートフォンアプリ開発その他(プログラミング・開発) カテゴリ一覧を見る OKWAVE コラム 突然のトラブル?プリンター・メール・LINE編 携帯料金を賢く見直す!格安SIMと端末選びのポイントは? 友達って必要?友情って何だろう 大震災時の現実とは?私たちができる備え 「結婚相談所は恥ずかしい」は時代遅れ!負け組の誤解と出会いの掴み方 あなたにピッタリな商品が見つかる! OKWAVE セレクト コスメ化粧品 化粧水・クレンジングなど 健康食品・サプリ コンブチャなど バス用品 入浴剤・アミノ酸シャンプーなど スマホアプリ マッチングアプリなど ヘアケア 白髪染めヘアカラーなど インターネット回線 プロバイダ、光回線など
お礼
配列がないので一つのプロパティしか入れられないのですね。 fontsize color をセットにして見出し用の変数が作れれば変数一つ指定すればいいので良いと思ったのですが、 このようなセットにしたい場合はutilityしか選択肢がないのが当分続きそうですね
補足
margin:var(--a),var(--b),var(--c),var(--d); のようなことはできないのでしょうか? あくまで一つの値しか代入できないのがcssの変数なのですかね?