並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 24 件 / 24件

新着順 人気順

WRAPの検索結果1 - 24 件 / 24件

タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。

WRAPに関するエントリは24件あります。 cssCSSweb制作 などが関連タグです。 人気エントリには 『日本語におけるtext-wrapプロパティの運用』などがあります。
  • 日本語におけるtext-wrapプロパティの運用

    CSSのtext-wrapプロパティを使うと、テキストの行の折り返し方法を変更できる。text-wrap: balanceを適用すると、適用しない場合と比べて次のように変化する。 CSS text-wrap: balance  |  CSS and UI  |  Chrome for Developers text-wrap: balanceが適用された下の例では、すべての行の長さが均等になるように制御されている。 しかし正確に言えば、すべての行の長さが必ずしもまったく同じになるわけではない。文字の適切な折り返し位置を考慮した上で、おおよそ同じくらいの長さになるように分配される、というのが正しい。その際、一つの英単語の途中で行が分割されるようなことは通常起こらない。これは、英語では単語の区切りに空白文字を挟んで記述されるが(わかち書き)、それが改行位置を決めるためのヒントとなるからである。

      日本語におけるtext-wrapプロパティの運用
    • CSSの新機能! テキストの行のバランスを自動調整する「text-wrap: balance;」の基礎知識と使い方

      テキストが複数行のときに、行ごとの文字数を同じにしてバランスを自動調整するCSSの新機能「text-wrap: balance;」が、Chromeでサポートされました。 日本語だと複数行の文字数を同じにしたいということは少ないと思いますが、見出しやコピーなどで文字数を揃えたいときに使えます。まぁ使ってもかなりピンポイントになるでしょう。 text-wrap: balance;の基礎知識と使い方、注意点を紹介します。 CSS text-wrap: balance by Adam Argyle 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 text-wrap: balance;とは テキストのバランスを見つける 制限事項 ブラウザが使用している技術の簡単な説明 text-wrap: bala

        CSSの新機能! テキストの行のバランスを自動調整する「text-wrap: balance;」の基礎知識と使い方
      • GitHub - andyk/ht: headless terminal - wrap any binary with a terminal interface for easy programmatic access.

        You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

          GitHub - andyk/ht: headless terminal - wrap any binary with a terminal interface for easy programmatic access.
        • overflow-wrap: break-word; や word-break: break-all; が万能の改行処理だったなら、こんなに苦労していない - Qiita

          overflow-wrap: break-word; や word-break: break-all; が万能の改行処理だったなら、こんなに苦労していないHTMLCSS初心者 はじめに 今回解決したいのはこれです。 「overflow-wrapかけたのに改行されないしテーブルwidthもなんか勝手に伸ばされちゃってる問題」です。 こんなんHTML / CSSの初歩中の初歩じゃんwwwという方は、どうぞごゆるりとブラウザバックしてやってくださいませ… 「それ地味に悩んでた!」という方がもしいらっしゃいましたら、少しでも助けになれれば嬉しいです。というか一緒に悩みましょう。 あ、でも、もしそんな方が本当にいたら、こんなことに悩むよりも、 「全半角記号のブラウザテストだけ許容する」という呪文を唱えた方が5億倍早いです…というネタバレだけ先にしておきますね>< もくじ 当記事は、以下の内容に関する

            overflow-wrap: break-word; や word-break: break-all; が万能の改行処理だったなら、こんなに苦労していない - Qiita
          • CSS text-wrap: pretty  |  Blog  |  Chrome for Developers

            p { text-wrap: pretty; } https://codepen.io/web-dot-dev/pen/yLGmzLJ Typographic widows and orphans are single words that stand alone at the end of a paragraph or text block. Widows are words alone at the top of a text block and orphans are alone at the end of a text block. They can interrupt the way our eyes skim the text, making content harder to read. Some designers avoid them at all costs and g

            • CSS 日本語を単語の区切りで改行する方法(overflow-wrap: normal;が効かない場合にチェックするポイント)

              CSSで「overflow-wrap: normal;」を設定したのに意図した挙動にならないという人は「word-break」も設定しましょう 日本語の場合は改行ポイントの制御に「word-break: keep-all;」の設定が必要です CSS 日本語を単語の区切りで改行する方法(overflow-wrap: normal;が効かない場合にチェックするポイント) CSSなし 伊藤理々杏・岩本蓮加・梅澤美波・久保史緒里・阪口珠美・佐藤楓・中村麗乃・向井葉月・山下美月・吉田綾乃クリスティー・与田祐希・遠藤さくら・賀喜遥香・掛橋沙耶香・金川紗耶・柴田柚菜・清宮レイ・田村真佑・筒井あやめ・矢久保美緒・黒見明香・佐藤璃果・林瑠奈・松尾美佑・弓木奈於・五百城茉央・池田瑛紗・一ノ瀬美空・井上和・岡本姫奈・小川彩・奥田いろは・川﨑桜・菅原咲月・冨里奈央・中西アルノ CSSあり 伊藤理々杏・岩本蓮加・梅

                CSS 日本語を単語の区切りで改行する方法(overflow-wrap: normal;が効かない場合にチェックするポイント)
              • 「Google Chrome 114」が正式公開 ~CHIPS、text-wrap:balance、Popover APIなどに対応/脆弱性の修正は16件

                  「Google Chrome 114」が正式公開 ~CHIPS、text-wrap:balance、Popover APIなどに対応/脆弱性の修正は16件
                • GitHub - shuding/react-wrap-balancer: Simple React Component That Makes Titles More Readable

                  You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                    GitHub - shuding/react-wrap-balancer: Simple React Component That Makes Titles More Readable
                  • さよなら、ありがとう Belle ちゃん - April Fools' Day 2022 Wrap-up - Beatrust techBlog

                    こんにちは。Beatrust で Libero として、現在は Product Growth を担当している Rei(真浦 玲)です。先週、2022 年 4 月 1 日に実施した、エイプリルフール限定の特別プロジェクト Belle(ベル)ちゃんに関するプロジェクト結果をご報告いたします。 tech.beatrust.com プロジェクト概要 アムールトラの Belle ちゃん アムールトラの Belle ちゃんを Beatrust 上に登場させて、ユーザーの皆さんにゲーム性を持ってプロダクト機能を使っていただくために、 特定の機能を利用したらお肉をあげて、トラの動物保護団体への寄付に貢献できるというプロジェクトを、一日間限定で実施いたしました。 Beatrust 上に Belle ちゃんのプロフィール情報を新規登録する Belle ちゃんのプロフィール情報に対する機能を利用してもらう(特に

                      さよなら、ありがとう Belle ちゃん - April Fools' Day 2022 Wrap-up - Beatrust techBlog
                    • CSS text-wrap: balance  |  CSS and UI  |  Chrome for Developers

                      Build with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.

                      • overflow-wrap: break-word; や word-break: break-all; が万能の改行処理だったなら、こんなに苦労していない - Qiita

                        はじめに 今回解決したいのはこれです。 「overflow-wrapかけたのに改行されないしテーブルwidthもなんか勝手に伸ばされちゃってる問題」です。 こんなんHTML / CSSの初歩中の初歩じゃんwwwという方は、どうぞごゆるりとブラウザバックしてやってくださいませ… 「それ地味に悩んでた!」という方がもしいらっしゃいましたら、少しでも助けになれれば嬉しいです。というか一緒に悩みましょう。 あ、でも、もしそんな方が本当にいたら、こんなことに悩むよりも、 「全半角記号のブラウザテストだけ許容する」という呪文を唱えた方が5億倍早いです…というネタバレだけ先にしておきますね>< もくじ 当記事は、以下の内容に関するメモ書きです。 CSSの改行処理プロパティのメリデメ 上記問題の暫定解決方法 対象のCSSプロパティは以下の通りです。 overflow-wrap: break-word; w

                          overflow-wrap: break-word; や word-break: break-all; が万能の改行処理だったなら、こんなに苦労していない - Qiita
                        • Go の自作エラーを errors.Is と errors.As で wrap 元のエラーと識別するときには、Unwrap も実装しよう

                          概要 Go ではデフォルトのエラーに対して、自作エラーを作成して wrap するように有識者の間では推奨されています。 ただ、wrap すると本来のエラーが隠れてしまいテストや実行時に単純な比較ができなくなります。 そこで、よく紹介されるのが、errors.Isとerrors.Asです。 erros.Isとerrors.Asを使うと wrap 済みエラーに対して、元のエラーとの比較できます。 しかし、紹介記事では、そのままコピー&ペーストするとtrueを返してほしいときに、falseを返してしまう方法を散見します。 本記事では、間違えてしまうパターンについて紹介し、解決方法を紹介します。 元のエラーが不要で、wrap したエラーのみで比較する実装のときには、本記事の手順は不要になります。 うまく比較できないパターン 最初に、うまく比較できないパターンがどのようなときに発生するのか紹介します

                            Go の自作エラーを errors.Is と errors.As で wrap 元のエラーと識別するときには、Unwrap も実装しよう
                          • ラップ=消耗品の時代はもう終わり! 洗って何度も使える「The Wrap」 | ライフハッカー・ジャパン

                            使い捨てってなんかダサくない? 商品の成り立ちや衛生視点で一概に使い捨てが悪というワケではありませんが、SDGsをはじめとした環境マインドの向上で、リユーザブルや循環型でない消費は肩身が狭くなってくる流れですよね。 とはいっても、いきなり生活をシフトするのは難しいのでまずは身近なところから変えていくのはいかがでしょうか? 姉妹サイトmachi-yaにてキャンペーン中の「The Wrap」は洗って繰り返し使えるシリコンラップで、レンジやオーブンでの使用やアルミホイル代わりとしても使える製品とのこと。 料理をする際に役立ちそうなアイテムでしたので、サンプルをお借りして使ってみた感想をお届けします。 きちんとくっつくけど扱いやすいPhoto: junior「The Wrap」を触ってまず気づいたのが、そのくっつく力でした。触れるまではそれほどくっつかないかな?と想像してたのですが、容器はもちろん

                              ラップ=消耗品の時代はもう終わり! 洗って何度も使える「The Wrap」 | ライフハッカー・ジャパン
                            • VSCode: 選択文字列部分をhtmlタグで囲む(wrap)方法3通り

                              HTMLコーディングしていると、 文字列をdivタグやpタグ等で囲みたい場合があります。 Visual Studio Codeではタグで囲む方法がいくつかあるので、 ここでは3通りの方法を紹介します。 選択行が一行の場合 タグで囲みたい選択行が一行の場合に便利な方法です。 例えば、「あいうえお」 という文字列を p タグで囲みたい場合は、 p{あいうえお} と入力し、Enterを押します。 すると、<p>あいうえお</p> というように p タグで囲まれます。 要は、タグ{選択文字列}です。 あいうえおかきくけこ ↓ 文字列を p{} で囲む p{あいうえおかきくけこ} ↓Enterキー で展開される <p>あいうえおかきくけこ</p> ↓次に「かきくけこ」をsmall{} で囲む <p>あいうえおsmall{かきくけこ}</p> ↓ Enterキー で展開される <p>あいうえお<sma

                              • CSS Text balancing with text-wrap:balance

                                🔥 Want improve your Debugging CSS skills? Get my book for just $19.99! Buy the book Have you ever wished there is a native way in CSS to make two lines headlines consistent in the number of words per line? As a designer, I spot that a lot when dealing with varying content lengths while designing a website or a UI. Such a thing can make the UI you’re working on feels unbalanced, or missing somethi

                                  CSS Text balancing with text-wrap:balance
                                • 洗って繰り返し使える蜜蝋ラップ(aco wrap)で手作りパンを保存 - TAYORAKO KITCHEN

                                  みつろうラップ(aco wrap)「蜜蝋」という名前の通り、ミツバチの巣から採取したみつろうが素材になっています。 aco wrap(アコラップ)とは、岐阜県のミツバチの巣から採取したみつろうをベースにしたオイルを、たっぷりとオーガニックコットンの生地に染み込ませた天然ラップです。 主にみつろうとオーガニックコットンでできており、食材や器をぴたりとラップします。 みつろうとホホバオイルには抗菌性と天然の保存性があるので、食品の鮮度の持ちが良くなります。 原材料はフェアトレードによってつくられたオーガニックコットン、岐阜県のみつろう、未精製ゴールデンホホバオイル、植物由来の天然樹脂、すべて天然素材のみを使用しています。 aco wrap 100均にも何度も使えるシリコンラップは売っているけれど、みつろうラップは自然から生まれたエコラップです。 色が独特で日本の伝統色の組み合わせなんだって。

                                    洗って繰り返し使える蜜蝋ラップ(aco wrap)で手作りパンを保存 - TAYORAKO KITCHEN
                                  • scissor wrap - fourth artisan

                                    MERCHANT & Mills マーチャント&ミルズとは、 英国ウェールズが拠点の裁縫道具メーカー。 どこかレトロな感じがして、 私のお気に入り。 そのプロダクツの一つである『scissor wrap』 なんてことはない、 ただのハサミケースですが。 一枚革で作られており、 くるくるっと巻き込んでしまう方式。 ゆえに、シザーラップ。 そして、内側にも刻印を施すだなんて、 ちゃんと分かってらっしゃる。 そういうところが大事なんですよね。 こういうしなものってやつは。 こんなふうにしまっておく必要はないけど、 それだけで幸せになれる気がする。 にんまりします。 見せびらかしたくなります。 やっぱり私ってやつは、馬鹿だなぁ・・・。 ま、いいか。 fourthartisan.com

                                      scissor wrap - fourth artisan
                                    • GitHub - tecfu/tty-table: Terminal table for Windows, Linux, and MacOS. Written in nodejs. Also works in browser console. Word wrap, padding, alignment, colors, Asian character support, per-column callbacks, and you can pass rows as objects or arrays. Bac

                                      You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                        GitHub - tecfu/tty-table: Terminal table for Windows, Linux, and MacOS. Written in nodejs. Also works in browser console. Word wrap, padding, alignment, colors, Asian character support, per-column callbacks, and you can pass rows as objects or arrays. Bac
                                      • fmt.Errorf(" : %w", ...)は、pkg/errors.Wrap()を殺す - podhmo's diary

                                        go1.13以降、github.com/pkg/errorsから、標準ライブラリのerrorsとfmtを使う形への乗り換えが行われていたり行われていなかったりする1。 乗り換えの方法についてはerrors.Is()やerrors.As()の使い分けに終止している事が多い気がする。それ以外の変更点で気になったことについてメモをしておく。 pkg/errors.Wrap() その前におさらい。 pkg/errors.Wrap() は2つの機能を持っている。 エラーにちょっとした修飾をつける スタックトレースを取得する 前者は fmt.Errorf("%w:", ...) で対応できるようになった。 一応pkg/errorsの実行例も表示しておく。実行例は以下の通り。 %+vでSprintfなどした場合に、ちょっとした修飾付きでスタックトレースを含んだ表現を出力してくれる。これは一般的な言語のp

                                          fmt.Errorf(" : %w", ...)は、pkg/errors.Wrap()を殺す - podhmo's diary
                                        • GitHub - linaro-its/aws2-wrap: Simple script to export current AWS SSO credentials or run a sub-process with them

                                          You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                            GitHub - linaro-its/aws2-wrap: Simple script to export current AWS SSO credentials or run a sub-process with them
                                          • 【CSS】overflow-wrap (word-wrap) と word-break の違い | Hazu Labo

                                            HTMLで文章を書く場合、表示範囲の一番最後まで来た時の改行は、何も指定していない場合、以下の通りです。 日本語:単語の途中であろうと、自動改行(禁則処理あり) 英数字(適当なスペースあり):スペースに合わせて自動改行(禁則処理あり) 英数字(表示範囲を超える連続する長いもの):改行されずはみ出す 特に、この長い英数字の改行を制御するのに便利な CSSプロパティ、overflow-wrap (word-wrap) と word-break 、違いは何なんでしょう? ① word-break : 表示範囲最後まで来た時、(単語が長かろうが短かろうが)単語の途中で改行させるかどうか ② overflow-wrap (word-wrap) : 表示範囲に収まらない長い連続する文字列を、途中で改行させるかどうか (②ですが、word-wrap が古い名称で、サポートされていないブラウザもあるため、

                                            • IE10とIE11でtable要素内でflex-wrapが効かない | HTML・CSS・JavaScriptのテクニック集 | Webサイト制作支援 | ShanaBrian Website

                                              table要素内である要素にflex-wrapプロパティのwrapを指定すると、IE10とIE11で効かず(折り返されず)幅が超えてしまう現象が発生します。 他のブラウザ: IE10とIE11: HTML <table> <tbody> <tr> <td> <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> </ul> </td> </tr> </tbody> </table> CSS table { border-collapse:collapse; border-spacing:0; } table td { border:1px solid #ccc; padding:10px; width:300px;

                                                IE10とIE11でtable要素内でflex-wrapが効かない | HTML・CSS・JavaScriptのテクニック集 | Webサイト制作支援 | ShanaBrian Website
                                              • electrical in tape the wire Wrap | ならべかえ 英語 リスニング

                                                単語をならべかえて英文を完成させよう(レベル6)「electrical in tape the wire Wrap」「電線を絶縁テープで巻いて下さい。」#英語学習 | ならべかえ 英語 リスニング

                                                  electrical in tape the wire Wrap | ならべかえ 英語 リスニング
                                                • カメラもノートPCも包むだけ「BIG Muti Wrap」で持ち運びが軽やかに【今日のライフハックツール】 | ライフハッカー・ジャパン

                                                  モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】

                                                    カメラもノートPCも包むだけ「BIG Muti Wrap」で持ち運びが軽やかに【今日のライフハックツール】 | ライフハッカー・ジャパン
                                                  1

                                                  新着記事