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

ウェブサイトのダウンロードに必要な時間は大幅に短縮され、解析も容易になると思います。 これらの言語が標準として課されていないのはなぜですか？明らかに、それらは生のhtmlやCSSよりも優れています... 中間のHTML / CSSコードを排除することから私たちを遠ざけているのは、ブラウザだけです。

11 html  css 

デザイナーからデザインを取得すると、PSD（Photoshop）ファイルとして取得します。私は常に適切なレイヤーとフォルダー名、基本的にはクリーンで管理されたPSDを期待しています。この設計から、HTML、CSS、およびJavaScriptを開発し、バックエンド開発者に提供します。彼らが理解しやすくするために、私は セマンティックコードを書く、 JavaScriptとCSSを外部ファイルに保存し、 HTML、CSS、JSファイルに有用なコメントを追加し、 CSSスプライトを使用します（開発者は気に入らないが）。 HTML5ボイラープレートを使用し、 JavaScriptにjQueryを使用し、 可能な限り、新しいHTML5タグとCSS3を使用してみてください。 HTML、CSS、JS、および画像を含むZipファイルを送信しました。 レイアウトに小さな変更を加える必要がある場合、開発者がそれを処理できると期待しています。 バックエンド開発者や他のCSS忍者から、バックエンドシステムとの統合を容易にするためのファイルの構成とマークアップの観点から、もっとできること（つまり、バックエンドテクノロジー、PHP、.NET）を聞きたいです。 、Rubyなど）異なるクライアントは異なるシステムを使用します。

11 javascript  html  css  jquery 

閉じた。この質問は意見に基づいています。現在、回答を受け付けていません。 この質問を改善したいですか？この投稿を編集して事実と引用で答えられるように質問を更新してください。 5年前に閉鎖されました。 私は常に可能な限りCSSを使用してJavaScriptを拒否しています。 つまり、JavaScriptではなくCSSを使用してタブとロールオーバーボタンを作成します。 JavaScriptを提唱するいくつかのソリューション、特にWt Webフレームワークを見てきました。ただし、ブラウザが対応していない/ jsが無効になっている場合は、CSSに正常にダウングレードします。 CSSとJavaScriptには異なる目的があることは知っていますが、重複しています。これがこの質問のボーンです。 JavaScriptを使用してできるだけCSSを使用し続ける必要がありますか？

11 javascript  css 

数年前、私は自分がWeb開発者であり、基本的な3言語（HTML、CSS、JS）と多くのPHPを知っていると考えていました。単純なテキストから実際のWebサイトに移行することは、いわゆる「標準」が存在するために苦痛でしたが、当時はそれが途方もなく複雑でした。それはほとんどこれに要約されました（IE関連のものを除いて）： 標準は、より簡単な方法で物事を行う古い方法を置き換えるためにあります。ただし、実際にいくつかのもの（たとえば、CSSベースのレイアウト全体）を実際に実装しようとすると、よりシンプルでまだ機能するソリューションを実行した場合、実際に実行するのに10倍時間がかかりました。同じようにレンダリングされる場合、ブラウザを変更すると10倍長くかかり、壊れるより複雑な例を使用する必要があるのはなぜですか？これにより、Freenode IRCの## php、## css、および## jsで多くの宗教的な議論が巻き起こり、実際に## cssから禁止されました。 私の質問：10倍長くかかっても、単純なものと同じ結果が得られる場合でも、すべての標準とコーディング規則に従う必要がありますか？ ポーリングタグの場合、任意のサイズ（巨大または小）のウェブサイトを持っているあなたの人々は、ないあなたはすべての基準に従いますか？

11 coding-standards  html  css 

私はGulpを使用して、取り組んでいるプロジェクトのSASSコードから縮小されたCSSを生成します。 Gitからライブ配信するときに、この縮小されたCSSを再生成するのがベストプラクティスと考えられるかどうか疑問に思いました... または 縮小されたCSSファイルをGitに保存して、サーバー側で追加の作業をせずに、自動的に本番環境にプッシュする方法は？ これについての人々の考えに感謝します。ありがとう！

10 version-control  git  css  deployment 

元の画像が実際のものではない画像に幅/高さ属性を使用することは悪い考えであると常に見られてきました。これは、ピクセル化された画像や、必要以上に大きいダウンロードサイズを意味する場合があります。 しかし、これはまだ問題ですか？写真のサイズを大きくすることはお勧めしませんが、元のサイズとの違いがあまり大きくなく、縮小しても問題にならないはずです。 たとえば、600x400の写真に400pxの幅を貼り付けます。最近のほとんどのブラウザーは画像を縮小し、レンダリングはまだまともです。 だから、これについてみんなはどう思いますか？

10 web-development  html  css  image-manipulation 

ブラウザーが接頭辞のないバージョンを使用するのではなく、ブラウザーに新しいCSS機能の接頭辞を付ける正当な理由はありますか？ たとえば、背景のグラデーションのサンプルコードは次のようになります。 #arbitrary-stops { /* fallback DIY*/ /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(#2F2727), color-stop(0.05, #1a82f7), color-stop(0.5, #2F2727), color-stop(0.95, #1a82f7), to(#2F2727)); /* Safari 5.1+, Chrome 10+ */ background: -webkit-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727); /* Firefox 3.6+ */ background: -moz-linear-gradient(left, #2F2727, #1a82f7 …

10 web-development  css  browser-compatibility 

概要/背景：CSSコンポーネント 比較的大きなWebサイトの場合、SASSを使用して、コンポーネント内のCSSを管理しようとしています。コンポーネントの基本的な考え方は、コンポーネントはDOMの上位のコンテナ要素とは関係なく、どこでも同じように見える必要があるということです。 したがって、次のようなもの（SASS）は避けたいです。 // User picture component. .user-picture { img {..} } // Override user picture for the frontpage. body.page-front .user-picture img {..} 代わりに、ユーザーの写真をフロントページで違って見えるようにしたい場合は、別のコンポーネントにする必要があります。たとえば、SASS継承、またはミックスイン： // User picture component. .user-picture { img {..} } // User picture on frontpage. .user-picture-front { @extend .user-picture; img {..} } 次に、トップページのhtmlを調整して、異なるバージョンのユーザー画像を使用するようにする必要があります。 ここまでは順調ですね。私は、CSSコンポーネントについての私の現在の理解の図解として上記を投稿しました。 質問：モディファイヤクラス-良い習慣？ 現在、問題が発生しています。一部のページの背景が暗い（黒）ため、テキスト、境界線などを白にする必要があります。 これはどういうわけかコンポーネントを超えています。同じコンポーネントにはデフォルトで暗いテキストが必要ですが、背景が暗いコンテナ内にある場合は白いテキストになります。 …

9 css  component 

CSS、JS、HTMLのレビューのためのガイドラインを作成するように依頼されました。JSのコーディングガイドラインがあることは知っていますが、HTMLとCSSについては何も知りません。JSをレビューするために、私は確かにそれらのガイドラインに従い、それらに言及します。しかし、CSSとHTMLはどうでしょうか？論理エラーやインデントの問題以外に、マークアップやCSSを確認するときに確認する必要がある具体的な事項はありますか？

9 javascript  html  code-reviews  css 

私はウェブサイトを作るために雇われ、デザイナーと仕事をしています（たまたまクライアントと連絡を取り、私を雇ったので、いいえ、私は彼のお尻を蹴り出すことができません=））あまりにも恐れていますphpコードに触れるには、htmlとcssの初心者で十分なモデルを提供できないため、今日の作業は、半分プログラムされたページの新しいhtmlモデルを調べ、<div>sを削除してクラスを変更することなどです。 。 私たちの両方にとってこれをより簡単にするための何らかのツール、またはいくつかのより良いワークフローはありますか？多分私はこれを間違った方法で扱っています、私はウェブ開発に不慣れです、そして私に彼にグラフィックのモックアップを与えてそしてそれをさせるだけの十分なHTML / CSS（そして彼はそうしているでしょう）を知りませんすべてのことなので、私たちがやっていることは、彼が望んでいるように見える静的なHTMLページを私に与えて、<?php ?>それをあちこちに置くことです=） 誰か私にこれについていくつかのアドバイスを与えることはできますか？

9 php  html  css  workflows 

この記事では、フロントエンドコードを整理するために取り組んできました。BEM / SMACSSの記事を参照し、次に他の記事を参照します。 私は本当にベストプラクティスが何であるかを理解しようとしています...私はこの "標準"を決定するために数日を持ち、それから高優先度/高可視性/限られたタイムラインプロジェクトを実行する必要があります。そのため、アプリと同じように拡張できる基盤から始めたいと思います。 segment... という名前のコンポーネントがあるとすると、segments1ページあたり最大10 個のページが作成されます。それぞれsegmentが同じ基本クラスを共有します。ただし、特定のものsegmentsには修飾子があります（異なる背景色）。さらに、（BEMアプローチの）各ブロック内の要素にも修飾子があります。実例を示すために、ここに簡単な実装を示します（単一の要素のみで、arrowサイト全体にはそれぞれ4〜5個の要素がありますsegment）。 .segment__arrow { position: absolute; bottom: -24px; left: 50%; margin-left: -11px; background-position: center no-repeat; height: 21px; width: 21px; z-index: 2; } .segment__arrow--orange { @extend .segment__arrow; background-image: url('/images/arrow_orange.png'); } .segment__arrow--white { @extend .segment__arrow; background-image: url('/images/arrow_white.png'); } したがって、これは単一クラスのアプローチです。 <div class="segment__arrow--white"> ... </div> または、マルチクラスアプローチを使用することもできます。 .segment__arrow { …

8 architecture  css  scalability  front-end 

休業。この質問には、より焦点を当てる必要があります。現在、回答を受け付けていません。 この質問を改善してみませんか？質問を更新して、この投稿を編集するだけで1つの問題に焦点を当てます。 6年前休業。 Webアプリケーションのプロトタイプを開発しています。HTML、CSS、JavaScriptのみを使用したい。私はテキストエディターを使用することを好み、Axureのような新しいツールを学ぶ（またはそのために支払う）必要はありません。 あなたの考えでは、ベストプラクティスは何でしょうか？私にとって、良いプロトタイプには多くの資質があります。 迅速に開発 改善が簡単 UXに関する公正な忠実度（これは、ワイヤーフレームに特化したOmnigraffleやPowerPointなどのツールを失格にします） 私はできるだけ早く学習するように努めていますが、あなたの経験に基づいて、どのようにして迅速かつ機敏に対応できるかについて知りたいと思います。 参照： http://www.boxesandarrows.com/view/prototyping-with

8 javascript  html  css  methodology  prototyping 

私はかなり複雑なGUIを備えたWebアプリを構築してきました-多くの小さな要素を並べて、さまざまな動作（ドラッグ、クリック、ただし状況依存）を必要とする他の要素内に。 私のコードは次のように機能する傾向があります： コントロールはhtmlタグとして始まります <li> 次に、クラスをタグに追加します <li class = 'static passive included'> 一部のクラスは、CSSスタイリングが外観に影響を与えるためのものである可能性があります .static {background: blue; float: left;} 他の人は、jQueryに基づいて、関連するDOMイベントの動作を提供します $("#container").delegate(".passive", function {onclick : //do-stuff}) そして、他のものは、ドキュメントをスキャンするとき、通常のJavaScriptによって拾われるかもしれません 'included'クラスを持つすべてのノードのテキスト値を収集します。したがって、特定のDOM要素は、cssとjQueryの組み合わせによって定義されたクラスを実装するGUIオブジェクトです。 私の質問は、これは良い方法ですか？そして、これらは本当に「装飾者」でもあります-彼らは確かに「動的にオブジェクトに追加の責任を追加します」が、私はその用語についてはわかりません。最後に、このパターンを自分のサイトで使用していますか？

8 javascript  design-patterns  web-applications  jquery  css 

私はこれを今見つけることができませんが、トピックについて議論しているさまざまなブログで以前に読んだことがあります。私は例を挙げますが、うまくいけばそれは明確です（それはまったく何も明確化しないかもしれませんが）。 このマークアップを考えると（意図的に任意）： <div class="myWrapper"> <a href="somepage.url" class="img"> <img url="someimage.url"> </a> </div> <div class="yourWrapper"> <a href="somepage.url" class="img"> <img url="someimage.url"> </a> </div> CSSは次のように読み取ることができます。 .myWrapper .img img {border: thin black solid;} .myWrapper .img {margin:10px;} .yourWrapper .img img {border: thick red dashed;} .yourWrapper .img {margin:20px;} 次のように書くこともできます： .myWrapper { .img { margin:10px; img { border: …

8 html  css 

JavaScript / PHP / CSS / HTMLのWebアプリケーション用に約4000行のコードがあります。どうすれば適切にテストできますか？ IEとSafariの最新バージョンのみをサポートしています。私はすべてのバグを解決しました。それをテストして、コードをロバストと呼べるようにするための良い方法はありますか？ 私は、perl Mechanizeを使用してフォームに自動入力するか、同様のことを行うことを検討しました。 また、PHPクラスの内部動作をテストするためのPHPテストクラスもあります。ただし、満たす必要がある標準または適合性のガイドラインはありますか？このコードがコードの強盗などのIEEE xxx foo標準に合格していると言う方法はありますか？ W3バリデーターを使用してHTMLを検証し、jslint.comを使用してJavaScriptを検証しました。 勤勉項目のリストはここにあります： HTML / CSSがW3検証に合格 JavaScriptはjslintを渡します PHPが内部PHPテストクラスに合格 ユーザーテスト ユーザーアクションのセットを作成し、perl mechanizeなどを使用して実装します。 コードをWebにリリースするための標準または手順はありますか？

8 php  javascript  html  css  testing