タグ

CSSとweb制作に関するtoyaのブックマーク (7)

  • Web制作の時短に!2020年の便利オンラインツール・ベスト100選

    この記事では、2020年に公開された便利なWebオンラインツール・ベスト100個をまとめてご紹介します。 定期的にリストアップしている最新オンラインツールまとめ記事では、2020年にかけて合計306個の新しいツールやサービスが登場しました。 その中でも、特にWebデザイン制作に便利なツールを選りすぐったコレクションで、「無料で利用できるツール」を揃えています。 これらのツールやサービスを活用すれば、Webデザイン制作をより快適に進めることができるでしょう。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. CSSツール(14個) 2. パターンツール(7個) 3. イラスト系ツール(3個) 4. デザインツール(10個) 5. 配色カラーツール(6個) 6. グラデーションツール(3個) 7. SVGツール(8個) 8. スクリーンショ

    Web制作の時短に!2020年の便利オンラインツール・ベスト100選
  • 「出会えたことに感謝したいCSSベスト3」まとめ

    スダ氏 @sudarexyz 出会えたことに感謝したいCSSベスト3 1位 display: flex; 2位 box-sizing: border-box; 3位 height: 100vh; 2018-04-07 21:44:27 スダ氏 @sudarexyz justify-content: space-between; align-items: center; この辺も入れたかったけど全部FlexBox関係になっちゃうし、ランキングは今着手している案件に強く依存してる。 他の人のも見てみたい。 #出会えたことに感謝したいCSSベスト3 2018-04-07 22:02:07

    「出会えたことに感謝したいCSSベスト3」まとめ
    toya
    toya 2018/04/09
    border-radius、画像使わなくても角丸が!!!!って感動した
  • これからのCSSはmargin禁止!?CSSグリッドレイアウトやコンポーネント指向なCSSについて、矢倉さんに聞いてきた!

    これからのCSSはmargin禁止!?CSSグリッドレイアウトやコンポーネント指向なCSSについて、矢倉さんに聞いてきた! 白石 俊平(HTML5 Experts.jp編集長) こんにちは、編集長の白石です。 この記事は、9月24日に開催されたHTML5 Conference 2017に登壇したエキスパートに、お話されたセッションのトピックを中心に語っていただこうとういものです。セッションの内容をより深く理解する手助けになるだけでなく、記事単体でも面白く読んでいただけることを目指しています。 今回お話を伺ったのは、ピクセルグリッドの矢倉眞隆さんです。 矢倉さんのセッション「まあまあ最近のCSSとつらくならないための書き方」に関するスライド資料は、こちらで公開されています。 インパクト大!CSSグリッドレイアウト概要 白石: では、まずは簡単に自己紹介をお願いできますか? 矢倉: 昨年(2

    これからのCSSはmargin禁止!?CSSグリッドレイアウトやコンポーネント指向なCSSについて、矢倉さんに聞いてきた!
  • http://buchineko.website/chrome-devtools-cording/

    http://buchineko.website/chrome-devtools-cording/
  • CSSリファレンス - とほほのWWW入門

    CSSリファレンス トップ > CSSリファレンス [ABC順] 概要 CSS入門 リンク サンプル 表記について CSS3関連規約 セレクタ * { ... } E { ... } ns|E { ... } E, F { ... } E.class E#id E F { ... } E > F { ... } E + F { ... } E ~ F { ... } E || F { ... } [attr] [ns|attr] [attr="val"] [attr~="val"] [attr|="val"] [attr^="val"] [attr$="val"] [attr*="val"] :any-link :link :visited :local-link :target :target-within :scope :hover :active :focus :focus-visi

  • CSS謝罪文 - jsdo.it - Share JavaScript, HTML5 and CSS

    CSSによるインデックスされない謝罪文 CSS文が書いてあるので、画面上は表示されているがGoogleでのキーワード検索には引っかからない 「流出」などの嫌な単語は:beforeと:afterに「流」「出」を分けて書くことで、自然言語解析を回避 #s { p:first-child { font-weight: bold; font-size: 120%; } p:not(:first-child) { text-indent: 1em; } p:nth-child(1):before{ content: "お 詫"; } p:nth-child(1):after{ content: " び"; } p:nth-child(2):before{ content: "平素は弊社のサービスをご利用いただき、誠にありがとうございます。"; } p:nth-child(3):before{ c

    CSS謝罪文 - jsdo.it - Share JavaScript, HTML5 and CSS
  • CSS: marginの正しい理解 - kojika17

    toggle()や変数、calc、:matchなど、今までにないCSSプロパティ、セレクタが提案・実装されて、CSS3, CSS4も楽しくなってきています。 border-radiusや、box-shadowなども、古いAndroidブラウザ以外なら、prefixなしで使える状況も増えてきました。 最新技術は、これから必要になってくるかもしれませんが、基も大切です。 float や position など、CSSコーディングを悩ませるタネはいくつもありますが、今回はその中でも私がCSSで一番難しいと思う margin について書きます。 「marginはバグが多い」という声をたまに聞きます。 しかし話を聞いてみると、正常な動作をバグと間違って認識しているケースもあります。 marginを正しく理解することによって、効率的なレイアウトを構築できますので、基的な内容ですが、読んで頂ければ幸

    CSS: marginの正しい理解 - kojika17
  • 1