特殊タグの例 (運営)
しおりを挟む

特殊タグの使用例

特殊タグの使用例
こんな感じに見えますメモ

特殊タグの使用方法
https://syosetu.org/?mode=readme_view&fid=55

掲示板形式のサンプル
https://syosetu.org/novel/211033/1.html

開示設定「チラシの裏」タグに「特殊タグ練習」とすることで特殊タグの練習・共有を目的とした投稿が可能です


※この作品には読み上げタグが使用されています。

誤字報告機能を使うと、このページで使用されている特殊タグをコピペすることができます。

 

■最近追加されたもの

※多機能フォーム・常時誤字報告機能は後ほど対応します。

テスト

 

Now Loading...

Now Loading..

 

ここをクリックすると文章が読み上げられます

ここをクリックするとHelloWorld(英語)

ここをクリックすると文章が早口で読み上げられます

※「この作品には読み上げタグが使用されています。」という表記が強制的に追加されます。

 

カラオケテロップみたいな感じ

■■■■■■■■■■■■■■■■■■

 

オンマウスでテーブル

 

背景込みで点滅できます。

 

外部サイト(ヤフー)へのリンク

 

画面内に表示されると再生開始されるオプションもあります※marquee,fade,blink,telopが対象

 


 

太字

斜体(windows7,8.1でメイリオフォントの場合は斜体にならないかもしれません)

取り消し線

下線

文字縮小

文字拡大

文字二段階縮小

文字二段階拡大

中央寄せ

右寄せ

リンク文字(同じ小説IDの中でのみ有効)

 ←この辺にジャンプ先

*2

上付き文字上付き文字

下付き文字下付き文字


水平線

 

文字背景色

段落背景色

文字枠色

段落枠色

文字縁色

不透明度

にじみ度

スクロール

点滅

緩やかに点滅

ゴゴゴゴゴ揺れ動く

振動する

(表形式です)
(1行目1列目th)(1行目2列目th右寄せ)(1行目rowspan)
(2行目1列目td中央寄せ)(2行目2列目黒背景td)
(3行目colspan)
(4行目colspan)

 

組み合わせ例

 

ここはhamelnです

 

 

(表も動きます)
(1行目1列目th)(1行目2列目th右寄せ)(1行目rowspan)
(2行目1列目td中央寄せ)(2行目2列目黒背景td)
(3行目colspan)
(4行目colspan)

 

線形移動

10段階移動

ゆるやか移動

test

 

 

Hello Worldこんにちは世界  《font:数字》《/font》

Hello Worldこんにちは世界  《font:数字》《/font》

 

画面内に表示されると再生開始されるオプションもあります

 

色設定

■white

■gray

■darkgray

■black(サイト全体の文字色は真っ黒ではないため)

■brown

■darkbrown

■red

■darkred

■gold

■orange

■darkorange

■green

■darkgreen

■blue

■darkblue

■purple

■pink

■#4399C7(6桁カラーコード指定)

■#F21(3桁カラーコード指定)

透明←透明

組み合わせも可

 

■この機能が使えるもの

各話の前書き、本文、後書き(あらすじは不可)

 

■各機能における対応状況

・PC版/スマホ版の小説閲覧

 

・携帯版の小説閲覧

△(リンクを貼る際、話数指定は可能だがID指定は不可、フォント変更機能なし)

 

・EPUB※フォント変更・動作系無し

 

・新PDF(実験中)※フォント変更・動作系・表無し

 

・PDF

×(タグは全消去。タグ対応版が今までの数倍生成に時間がかかってしまうため、対応方法を検討中)

 

・誤字報告

×(特殊タグがそのまま表示され、描画には反映されない)

 

・PC版一括表示

○(話数指定は可能だが、リンククリックで通常の小説閲覧ページに遷移)

 

・スマホ版縦書き表示(おまけ機能)※表無し

△(リンクを貼る際、話数指定は可能だがID指定は不可)

 

・PC/スマホ版多機能フォーム

 

・PC/スマホ版プレビュー

 

 

太字

斜体(windows7,8.1でメイリオフォントの場合は斜体にならないかもしれません)

取り消し線

下線

文字縮小

文字拡大

文字二段階縮小

文字二段階拡大

中央寄せ

右寄せ

リンク文字(同じ小説IDの中でのみ有効)

 ←この辺にジャンプ先

 

色設定

■white

■gray

■darkgray

■black(サイト全体の文字色は真っ黒ではないため)

■brown

■darkbrown

■red

■darkred

■gold

■orange

■darkorange

■green

■darkgreen

■blue

■darkblue

■purple

■pink

■#4399C7(6桁カラーコード指定)

■#F21(3桁カラーコード指定)

 

 

同一行左寄せ
同一行右寄せ

 

画面内に表示されると再生開始されるオプションもあります

(テーブル表示もできます)
(1行目1列目th)(1行目2列目th右寄せ)(1行目rowspan)
(2行目1列目td中央寄せ)(2行目2列目黒背景td)
(3行目colspan)
(4行目colspan)
こんな感じです

*2
脚注機能




アンケート機能
https://syosetu.org/?mode=readme_view&fid=61


目次 感想へのリンク しおりを挟む


しおりを挟む

※実験場

誤字報告機能を使うと、どういったタグが使用されているか確認可能です。
動作イメージ公開用

・一通り問題なさそうだったらそのうち正式告知します。
・急に仕様が変わる可能性があります。
・常時誤字報告、多機能フォームなどは未対応←そのうち対応します。
・閲覧環境によってはまともに動作しない恐れがあります
(IE,Operaなど)

box,textタグは後書きに設定値を記載しています


これはboxの角丸テスト

改行1テスト

改行2

 

これはテスト

改行1テスト

 

左右反転文字→これは左右反転文字です

X軸・Y軸・Z軸それぞれに対して45度ずつ回転→■テスト■

boxも同様のオプション可能:

X軸:画面水平方向

Y軸:画面垂直方向

Z軸:平面上(通常のrオプションと同じ)

 

これはフォント0これはフォント1です。:

This is 403これはフォント500です。

これは普通の(ルビ)です。

ABCDEFGHIJKLMNOPQRSTUVWXYZ@&(^^)!?abcdefghijklmnopqrstuvwxyz.0123456789_1013:Helzarliparxe(【人工言語】リパライン語)

 

 

 

 

 

 

 

自作フォント機能の例:ぁあぃいぅうぇえぉ0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

この文章はPCのみ表示されます
この文章はスマホのみ表示されます

この文章はPCスマホのみ表示されます ←textタグ版です

 

これはユーザフォントのテストです。ぁあぃいぅうぇえぉおかがきぎくぐけげこごさざしじすずせぜそぞただちぢっつづてでとどなにぬねのはばぱひびぴふぶぷへべぺほぼぽまみむめもゃやゅゆょよらりるれろゎわゐゑをん0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

点滅アニメーション終了後の状態を維持

点滅アニメーション終了後の状態を維持

 

ただの縦スクロール(終了時表示)

 

A long time ago in a galaxy far, far away…

Episode VII

THE FORCE AWAKENS

 

Luke Skywalker has vanished.

In his absence, the sinister FIRST ORDER has risen from the ashes of the Empire and will not rest until Skywalker, the last Jedi, has been destroyed.

 

With the support of the REPUBLIC, General Leia Organa leads a brave RESISTANC. She is desperate to find her brother Luke and gain his help in restoring peace and justice to the galaxy.

 

Leia has sent her most daring pilot on a secret mission to Jakku, where an old ally has discovered a clue to Luke’s whereabouts….

 

ただの縦スクロール

 

 

 

※upright:半角英数字も正立,sideways:すべて横向き デフォルトは半角英数字のみ横向き text:tcyを使用する場合、uprightオプション使用の場合は3文字目以降のスペースがおかしいです。

コレは縦書(たてが)きのテストです。あいうえおかきくけこさしすせそ

フォントが縦書きに対応していれば、そのまま縦書きっぽく表示できます。

対応していなければ「こんな感じ」です 文字間がずれる・回転する・左右ずれる・途切れる などが起こります

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。縦書(たてが)きルビテスト。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916129日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。333テスト22テスト

 

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

あいうえお縦書(たてが)かきくけこさしすせそ

Now Loading...←ページ表示時に再生開始

Now Loading..ああああ←ページ表示時に再生開始

 

改行

 

 

 

テスト・テスト

 

 

 

 

 

 

これが1倍これが3倍これが1倍これが1.44倍これが1.2倍これが0.5倍

 

 

2.投稿データの権利

本サービスに投稿されたテキスト等の情報の権利は、投稿したユーザに帰属します。

本サービスは、ユーザが投稿するテキスト等の情報を、本サービスの円滑な提供、構築、改良、メンテナンスに必要な範囲内で使用することができるものとします。

本サービスが前項に定める形でテキスト等の情報を使用するにあたっては、ユーザが設定している情報の公開の範囲を超える形ではこれを使用しません。

本サービスは、投稿したユーザの許可なく書籍等、本サービス以外で小説の全文を提供できないものとします。

2.投稿データの権利

本サービスに投稿されたテキスト等の情報の権利は、投稿したユーザに帰属します。

本サービスは、ユーザが投稿するテキスト等の情報を、本サービスの円滑な提供、構築、改良、メンテナンスに必要な範囲内で使用することができるものとします。

本サービスが前項に定める形でテキスト等の情報を使用するにあたっては、ユーザが設定している情報の公開の範囲を超える形ではこれを使用しません。

本サービスは、投稿したユーザの許可なく書籍等、本サービス以外で小説の全文を提供できないものとします。

 

 

これは

重ね字です1
 
重ね字です
     かきくけこ
テストです

 

 

test

 

 

 

 

 

コレは横書(よこが)きのテストです。あいうえおかきくけこさしすせそ

フォントが縦書きに対応していれば、そのまま縦書きっぽく表示できます。

対応していなければ「こんな感じ」です 文字間がずれる・回転する・左右ずれる・途切れる などが起こります

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。縦書(たてが)きルビテスト。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916129日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

 慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。本名は夏目金之助。帝国大学文科大学(東京大学文学部)を卒業後、東京高等師範学校、松山中学、第五高等学校などの教師生活を経て、1900年イギリスに留学する。帰国後、第一高等学校で教鞭をとりながら、1905年処女作「吾輩は猫である」を発表。1906年「坊っちゃん」「草枕」を発表。1907年教職を辞し、朝日新聞社に入社。そして「虞美人草」「三四郎」などを発表するが、胃病に苦しむようになる。1916年12月9日、「明暗」の連載途中に胃潰瘍で永眠。享年50歳であった。

 

あいうえお縦書(たてが)かきくけこさしすせそ

Now Loading...←ページ表示時に再生開始

Now Loading..ああああ←ページ表示時に再生開始

 

改行

 

Now Loading..ああああ

 

 

テスト・テスト

 

 

 

 

 

 

 

 

AA

 

これは改行テストです。

あああああああああああああああ

 

 

 

ああ

 

 




・サイズ指定系は%,もしくはem(単位指定なし)
w1←1文字分の幅(width:1em)
w1%←本文幅のうちの1%(width:1%)(maxは100%)
h1←1文字分の高さ(height:1em)行間考慮するとh2がおおよそ1文字分
h100%←本文幅の高さ(height:100vh) ※これ以上の幅を指定しても100vhがmaxです)




※矢印がある場合の意味
設定値 → 実際に適用されるcss


テキスト

・表示環境(未指定の場合両方表示)
PCのみ:pc
SPのみ:sp

・横幅(1-999)
w◯ → width:◯em
w◯% → width:◯%

・縦幅(1-999)
h◯ → height:◯em
h◯% → height:vh

・行間(0.1-5)
lh◯ → line-height:◯em

・文字幅(0.1-5)
cs◯ → letter-spacing:◯em

・背景色
bg#○○ ○○はカラーコード3桁or6桁

・枠線色
bo#○○ ○○はカラーコード3桁or6桁

・枠角丸(0.1-10)
bor◯ → border-radius:◯em

・回転(±360まで)
X軸:rx◯ → transform:rotateX(◯deg)
Y軸:ry◯ → transform:rotateY(◯deg)
Z軸:rz◯ or r◯ → transform:rotateZ(◯deg)

・padding(0.1-10)
p◯ → padding:◯em

・margin(0.1-10)
m◯ → margin:◯em

・縦書き
vertical → writing-mode:vertical-rl;-ms-writing-mode:tb-rl;-webkit-writing-mode:vertical-rl;-moz-writing-mode:vertical-rl;-o-writing-mode:vertical-rl;

・縦書きのテキスト向き
正立:upright → text-orientation:upright
横向:sideways → text-orientation:sideways

・領域外
隠す:overhidden → overflow:hidden
スクロール:overscroll → overflow:scroll

・位置指定(±10まで)
相対位置:relative → position:relative;overflow:hidden;
絶対位置:absolute(◯/◯) → position:absolute;left:◯em;top:◯em

・重なり順(1~999)
z◯ → z-index:◯

・インライン表示
inline → display:inline-block

・フォント一括変更
font◯  指定フォントに変更(ユーザフォントの場合はu先頭)



テキスト
・表示環境(未指定の場合両方表示)
PC:pcのみ
SP:spのみ

・文字色
#○○ ○○はカラーコード3桁or6桁

・背景色
bg#○○ ○○はカラーコード3桁or6桁

・回転(±360まで)
X軸:rx◯ → transform:rotateX(◯deg)
Y軸:ry◯ → transform:rotateY(◯deg)
Z軸:rz◯ or r◯ → transform:rotateZ(◯deg)

・文字の向き
縦中横:tcy → -webkit-text-combine: horizontal;-ms-text-combine-horizontal:all;text-combine-upright:all;
正立:upright → text-orientation:upright
横向:sideways → text-orientation:sideways

・サイズ(0.1-3)
s◯ → font-size:◯em

・フォント変更
font◯  指定フォントに変更(ユーザフォントの場合はu先頭)


目次 感想へのリンク しおりを挟む


しおりを挟む

※AA表示のテスト

AA表示のテスト
フォントはSaitamaar(@keageさま作成)を使用

[aa]
~~
[/aa] ←/は半角文字


これはAA表示のテストです。

※中のAAは表示確認用のため、他サイトさまからコピペ

※スマホ閲覧時のオートスケールを確認中

 

 

 

 

これはAA表示のテストです。

 

 

これはAA表示のテストです。

 

これはAA表示のテストです。

 

 

オンマウスでテーブル

これは脚注のテスト



目次 感想へのリンク しおりを挟む