Step By Work

大阪のホームページ制作会社

お問い合わせ 06-6809-1083
トップ ブログ コーディング関連 <wbr>自動挿入ツール【自動生成】

<wbr>自動挿入ツール【自動生成】

Date: 2023.12.14
Update: 2023.12.22

執筆･監修

上杉 洋　Hiroshi Uesugi

1991年生まれ。 株式会社ステップバイワーク代表。 2013年に株式会社n.uを設立。 2015年にStep by workとして独立。 2021年株式会社ステップバイワークとして法人化。 HP制作/SEO対策/コンテンツ制作/動画制作/YouTube運用/写真撮/WordPressを全て一人でやります。

B! ブックマークする コピーする
ここで変換後のテキストがどのように表示されるかを確認できます

ドラッグで幅を変えて改行を確認できます↑

解説と使い方

BudouXを使用して自動で<wbr>タグを挿入します

Chrome 119やEdge 119から利用可能なauto-phraseを使用した場合と同じ位置に<wbr>タグが挿入されます

auto-phraseだと変な個所で改行してしまうことがあるので任意の位置でいい感じに改行させたい場合は使ってください

文節でいい感じに自動改行してくれるword-break: auto-phrase;の解説

日本語において<wbr>で改行させたい場合は下記CSSを適用する必要があります

word-break: keep-all;
overflow-wrap: anywhere;

参考：word-break: auto-phrase は貧弱なのでword-break: keep-all を使うべし

B! ブックマークする コピーする

この記事へのコメント 0件

←Twitterもコツコツと更新してるのでよければフォローを、、、

おすすめ記事

弊社サービス紹介

名刺代わりのホームページ制作プラン

  • 費用：6万円+交通費
  • 写真撮影付きでお得！
  • 【今だけ】自己紹介動画も無料で作成します

YouTube運用+
Web集客サポートプラン

  • 費用：月額6万円+交通費
  • 毎月5分×5本のYouTube用動画撮影
  • ホームページ制作・保守運用
  • その他、SNS代行・チラシ作成等のサポート
  • 新規が3ヶ月に1人から1ヶ月10～15人へ！

YouTube動画から記事作成代行プラン

  • 費用：5分動画で1,500円
  • 検索エンジンからの流入も獲得可能！
  • Web用にSEO対策を考慮したライティング
  • 【限定1】1記事無料作成
  • 【限定2】無料でWordPressの
    インストールと初期設定までをサービス

新着記事