グリッドユニット

リンク

bingo!CMSグリッドユニットのパーツのうち、リンクについてご説明します。

PC・タブレット設定

  1. リンク表示エリアのボックススタイルを設定します。
      インライン:auto=リンクテキスト分の領域が表示エリアになります。
      ブロック:auto=ユニット配置したコンテナのカラム幅が表示エリアになります。
      指定サイズ=任意でサイズを入力します。
  2. リンク表示エリアのwidthを設定します。(初期値:auto) ※サイズ=指定サイズの時のみ。
  3. リンク表示エリアのheightを設定します。(初期値:auto) ※サイズ=指定サイズの時のみ。
  4. リンク表示エリアの左右位置を設定します。 ※サイズ=インライン:auto 又は 指定サイズの時のみ。
  5. リンク先のURLを入力します。
  6. リンク時のターゲットを指定します。
      _self=同じウィンドウで表示
      _blank=新しいウィンドウで表示
  7. 表示するテキストを入力します。
  8. テキストの左右位置を設定します。
  9. テキストの行間を設定します。
  10. テキストの文字間を設定します。
  11. テキストの下線を設定します。
  12. 文字の書体を設定します。
  13. 文字サイズを設定します。
  14. 文字サイズの単位を設定します。
  15. 文字の太字の設定をします。
  16. 文字色を設定します。
  17. マウスホバー時の文字色を設定します。
  18. 枠線の種類を選択します。
  19. 枠線の太さを設定します。(初期値:0)
  20. 枠線の色を設定します。
  21. マウスホバー時の枠線の色を設定します。
  22. リンク表示エリアの背景色を設定します。
  23. リンク表示エリアの背景色(グラデーション)を設定します。
  24. マウスホバー時のリンク表示エリアの背景色を設定します。
  25. マウスホバー時のリンク表示エリアの背景色(グラデーション)を設定します。
  26. リンク表示エリアの角丸の大きさを設定します。
  27. リンク表示エリアの角丸の大きさの単位を設定します。
  28. アイコンを選択します。
  29. マウスホバー時のアイコンを選択します。
  30. アイコンの表示位置を指定します。
  31. アイコンとテキスト間の余白を設定します。
  32. リンク表示エリア外側の余白を設定します。
  33. リンク表示エリア内側の余白を設定します。

※「SPも同じ内容で更新」をチェックして保存すると、チェックした項目の内容がスマートフォン設定の同項目にも変更内容が反映されます。

スマートフォン設定

  1. リンク表示エリアのボックススタイルを設定します。
      インライン:auto=リンクテキスト分の領域が表示エリアになります。
      ブロック:auto=ユニット配置したコンテナのカラム幅が表示エリアになります。
      指定サイズ=任意でサイズを入力します。
  2. リンク表示エリアのwidthを設定します。(初期値:auto) ※サイズ=指定サイズの時のみ。
  3. リンク表示エリアのheightを設定します。(初期値:auto) ※サイズ=指定サイズの時のみ。
  4. リンク表示エリアの左右位置を設定します。 ※サイズ=インライン:auto 又は 指定サイズの時のみ。
  5. リンク先のURLを入力します。
  6. リンク時のターゲットを指定します。
      _self=同じウィンドウで表示
      _blank=新しいウィンドウで表示
  7. 表示するテキストを入力します。
  8. テキストの左右位置を設定します。
  9. テキストの行間を設定します。
  10. テキストの文字間を設定します。
  11. テキストの下線を設定します。
  12. 文字の書体を設定します。
  13. 文字サイズを設定します。
  14. 文字サイズの単位を設定します。
  15. 文字の太字の設定をします。
  16. 文字色を設定します。
  17. 枠線の種類を選択します。
  18. 枠線の太さを設定します。(初期値:0)
  19. 枠線の色を設定します。
  20. リンク表示エリアの背景色を設定します。
  21. リンク表示エリアの背景色(グラデーション)を設定します。
  22. リンク表示エリアの角丸の大きさを設定します。
  23. リンク表示エリアの角丸の大きさの単位を設定します。
  24. アイコンを選択します。
  25. アイコンの表示位置を指定します。
  26. アイコンとテキスト間の余白を設定します。
  27. リンク表示エリア外側の余白を設定します。
  28. リンク表示エリア内側の余白を設定します。

ページトップ