タグ付けされた質問 「css」

私はこのコードを持っています： <table class="topics" > <tr> <td style="white-space: nowrap; padding: 0 5px 0 0; color:#3A5572; font-weight: bold;">Test</td> <td style="padding: 0 4px 0 0;">1.0</td> <td>abc</td> </tr> <tr> <td style="white-space: nowrap; padding: 0 5px 0 0; color:#3A5572; font-weight: bold;">test2</td> <td style="padding: 0 4px 0 0;">1.3</td> <td>def</td> </tr> </table> 行の間隔が離れすぎています。線を近づけたい。 私がしたことは、次のCSSを追加することでしたが、何も変更していないようです。 .topics tr { …

136 html  css 

（正方形のアスペクト比を維持するために）ブラウザのサイズを変更すると、幅に応じて高さが変わるコンテナを設定する次のコードがあります。 HTML <div class="responsive-container"> <div class="dummy"></div> <div class="img-container"> <IMG HERE> </div> </div> CSS .responsive-container { position: relative; width: 100%; border: 1px solid black; } .dummy { padding-top: 100%; /* forces 1:1 aspect ratio */ } .img-container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } コンテナ内でIMGを垂直に配置するにはどうすればよいですか？すべての画像の高さは可変で、応答性が高いため、コンテナの高さ/行の高さを固定できません...助けてください！

135 html  css  responsive-design  vertical-alignment 

ユーザーがDIVをクリックしたときにDIVタグのコンテンツを強調表示/選択する方法...すべてのテキストが強調表示/選択されるため、ユーザーは手動でテキストをマウスで強調表示する必要がなく、潜在的にテキストの一部が欠けていますか？ たとえば、次のようなDIVがあるとします。 <div id="selectable">http://example.com/page.htm</div> ...そしてユーザーがそのURLのいずれかをクリックすると、URLテキスト全体がハイライト表示されるので、ブラウザーで選択したテキストを簡単にドラッグしたり、右クリックで完全なURLをコピーしたりできます。 ありがとう！

135 javascript  css 

<button>HTMLの要素にpng画像を表示しようとしています。ボタンは画像と同じサイズで、画像は表示されていますが、何らかの理由で中央に表示されていないため、すべてを表示することはできません。つまり、画像の右上隅がボタンの中央ではなく、ボタンの右上隅にあるように見えます。 これはHTMLコードです： <button id="close" class="closing" onClick="javascript:close_clip()"><img src="icons/close.png" /></button> 更新： 実際に起こるのは、マージンの問題だと思います。2ピクセルのマージンができるので、背景画像がボタンからはみ出します。ボタンと画像は同じサイズで、だけな20pxので、非常に目立ちます...、を試しましたがmargin:0、padding:0役に立ちませんでした...

135 html  css  image  button 

JavaScript呼び出しを行うため<a>のhref属性のない多くのhtmlタグがありますonclick。これらのリンクには、カーソルのポインタスタイルはありません。彼らはテキストスタイルのカーソルを持っています。 href属性を使用せずに、リンクのカーソルスタイルをポインターに設定するにはどうすればよいですか？ href = "＃"を追加できることはわかっています。これはhtmlドキュメントの多くの場所にあり、href属性を使用せずにリンクのカーソルスタイルポインターを作成する方法を知りたいです。

135 javascript  html  css  hyperlink  cursor 

別のdivの中にdivがあります。 #outerと#inner。 #outer湾曲した境界線と白い背景があります。 #inner湾曲した境界線はなく、背景は緑色です。 #innerの湾曲した境界線を超えて拡張します#outer。とにかくこれを止める方法はありますか？ #outer { display: block; float: right; margin: 0; width: 200px; background-color: white; overflow: hidden; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #inner { background-color: #209400; height: 10px; border-top: none; } <div id="outer"> <div id="inner"></div> <!-- other stuff needs a white background --> <!-- …

135 css 

：last-childについてはすでに知っています。しかし、divを選択する方法はありますか： <div id="container"> <div>a</div> <div>b</div> <div>SELECT THIS</div> <!-- THIS --> <div>c</div> </div> 注：jQueryなし、CSSのみ

135 html  css  css-selectors 

ドキュメントを読みました。使用したい場合はscss、次のコマンドを実行する必要があります。 ng set defaults.styleExt scss しかし、それを実行してそのファイルを作成しても、コンソールにこのエラーが表示されます。 styles.bundle.js:33Uncaught Error: Module build failed: Error: ENOENT: no such file or directory, open '/Users/Egen/Code/angular/src/styles.css'(…)

135 css  angular  sass  angular6  angular-cli 

私はブートストラップ初心者であり、ブートストラップでコーディングしたい100％幅のテンプレートがあります。最初の列は左隅から始まり、Googleマップで右端まで伸びています。container-fluidクラスでこれを行うことができると思ったが、それはもはや利用できないようです。あなたがレイアウトを確認したい場合、私は、私は、ここにリンクをthemeforestからジオメトリPSDテンプレートを使用していますどのようにブートストラップ3とそのレイアウトを実現するためには考えています。http://themeforest.net/item/geometry-design-for- geolocation-social-networkr / 4752268

134 html  css  twitter-bootstrap  layout  twitter-bootstrap-3 

http://www.clearleft.comなどの多くのサイトでは、リンクをホバーすると、デフォルトのアクションであるすぐに切り替わるのではなく、別の色にフェードインします。 この効果を作成するためにJavaScriptが使用されていると思いますが、誰でもその方法を知っていますか？

134 css  hover  fade  effect 

ボタンを無効にできるように、Bootstrap 2.0のタブを無効にできますか？

134 javascript  css  twitter-bootstrap  twitter-bootstrap-2 

問題は、IFrameを使用してコンテンツをWebサイトに挿入する必要がある場合、最新のWebの世界では、IFrameも応答することが期待されていることです。理論的にはそれは単純です。単純にaiderを使用する<iframe width="100%"></iframe>かCSSの幅を設定しますiframe { width: 100%; }が、実際にはそれほど単純ではありませんが、そうすることはできます。 iframeコンテンツが完全にレスポンシブで、内部スクロールバーなしでサイズを変更できる場合、iOS Safariはiframe実際の問題なしにのサイズを変更します。 次のコードを考えた場合： <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=9,10,11" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Iframe Isolation Test</title> <style type="text/css" rel="stylesheet"> #Main { padding: 10px; } </style> </head> <body> <h1>Iframe Isolation Test 13.17</h1> <div id="Main"> <iframe height="950" width="100%" src="Content.html"></iframe> </div> </body> </html> Content.html： <html> <head> …

134 html  css  iframe 

2つのDIVがあり、一方はもう一方に埋め込まれています。外側のDIVが絶対配置されていない場合、絶対配置されている内側のDIVは、外側DIVの非表示のオーバーフローに従いません（例）。 外側のDIVを絶対位置に設定せずに、内側のDIVが外側のDIVのオーバーフローを非表示にする可能性はありますか？また、テーブルTD（例）から「成長」する必要があるため、内部DIVの相対位置はオプションではありません。 他のオプションはありますか？

134 html  css  layout  overflow  css-position 

Firefoxが現在のWebページとは異なるオリジンからフォントをロードしないという長い間問題がありました。通常、フォントがCDNで提供されるときに問題が発生します。 他の質問でさまざまな解決策が提起されました： CSS @ font-faceはFirefoxでは機能しませんが、ChromeおよびIEでは機能します Amazon S3 CORSの導入に伴い、CORSを使用してFirefoxのフォント読み込みの問題に対処するソリューションはありますか？ 編集：S3 CORS構成のサンプルを見ていただければ幸いです。 edit2：私は実際にそれが何をしたのか理解せずに実用的な解決策を見つけました。構成とAmazonの構成の解釈で発生するバックグラウンドマジックについての詳細な説明を誰かが提供できれば、それに対する報奨金を上げたnzifnabのように、それは大いに感謝されます。

134 css  firefox  amazon-s3  font-face  cors 

私はいくつかのプロジェクトで素晴らしいフォントを使用していますが、素晴らしいフォントアイコンで実行したいことがいくつかあります。次のように簡単にアイコンを呼び出すことができます。 <i class="fa fa-lock"></i> すべてのアイコンを常に境界のある丸い円にすることは可能ですか？このようなもの、私は写真を持っています： 使用する i { background-color: white; border-radius: 50%; border: 1x solid grey; padding: 10px; } 効果はありますが、問題はアイコンが常にテキストや要素の横よりも大きいことです。解決策はありますか？

134 css  font-awesome