こんな感じに見えますメモ
特殊タグの使用方法
https://syosetu.org/?mode=readme_view&fid=55
掲示板形式のサンプル
https://syosetu.org/novel/211033/1.html
開示設定「チラシの裏」タグに「特殊タグ練習」とすることで特殊タグの練習・共有を目的とした投稿が可能です
誤字報告機能を使うと、このページで使用されている特殊タグをコピペすることができます。
■最近追加されたもの
※多機能フォーム・常時誤字報告機能は後ほど対応します。
テスト
Now Loading...
Now Loading..
ここをクリックすると文章が読み上げられます
ここをクリックするとHelloWorld(英語)
ここをクリックすると文章が早口で読み上げられます
※「この作品には読み上げタグが使用されています。」という表記が強制的に追加されます。
カラオケテロップみたいな感じ
■■■■■■■■■■■■■■■■■■
斜体(windows7,8.1でメイリオフォントの場合は斜体にならないかもしれません)
取り消し線
下線
文字縮小
文字拡大
文字二段階縮小
文字二段階拡大
←この辺にジャンプ先
上付き文字上付き文字
下付き文字下付き文字
水平線
文字背景色
文字枠色
文字縁色
不透明度
にじみ度
点滅
緩やかに点滅
ゴゴゴゴゴ揺れ動く
振動する
(表形式です) | ||
---|---|---|
(1行目1列目th) | (1行目2列目th右寄せ) | (1行目rowspan) |
(2行目1列目td中央寄せ) | (2行目2列目黒背景td) | |
(3行目colspan) | ||
(4行目colspan) |
(表も動きます) | ||
---|---|---|
(1行目1列目th) | (1行目2列目th右寄せ) | (1行目rowspan) |
(2行目1列目td中央寄せ) | (2行目2列目黒背景td) | |
(3行目colspan) | ||
(4行目colspan) |
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(実験中)※フォント変更・動作系・表無し
○
×(タグは全消去。タグ対応版が今までの数倍生成に時間がかかってしまうため、対応方法を検討中)
・誤字報告
×(特殊タグがそのまま表示され、描画には反映されない)
・PC版一括表示
○(話数指定は可能だが、リンククリックで通常の小説閲覧ページに遷移)
・スマホ版縦書き表示(おまけ機能)※表無し
△(リンクを貼る際、話数指定は可能だがID指定は不可)
・PC/スマホ版多機能フォーム
○
・PC/スマホ版プレビュー
○
太字
斜体(windows7,8.1でメイリオフォントの場合は斜体にならないかもしれません)
取り消し線
下線
文字縮小
文字拡大
文字二段階縮小
文字二段階拡大
←この辺にジャンプ先
色設定
■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) |
アンケート機能
https://syosetu.org/?mode=readme_view&fid=61
目次 感想へのリンク しおりを挟む
しおりを挟む
※実験場
動作イメージ公開用
・一通り問題なさそうだったらそのうち正式告知します。
・急に仕様が変わる可能性があります。
・常時誤字報告、多機能フォームなどは未対応←そのうち対応します。
・閲覧環境によってはまともに動作しない恐れがあります
(IE,Operaなど)
box,textタグは後書きに設定値を記載しています
改行1テスト
改行2
改行1テスト
左右反転文字→これは左右反転文字です
X軸・Y軸・Z軸それぞれに対して45度ずつ回転→■テスト■
boxも同様のオプション可能:
X軸:画面水平方向
Y軸:画面垂直方向
Z軸:平面上(通常のrオプションと同じ)
これはフォント0です。:
This is 403です。
これは
ABCDEFGHIJKLMNOPQRSTUVWXYZ@&(^^)!?abcdefghijklmnopqrstuvwxyz.0123456789_
自作フォント機能の例:ぁあぃいぅうぇえぉ0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz
この文章は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日)江戸牛込馬場下横町に生まれる。
慶応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倍
本サービスに投稿されたテキスト等の情報の権利は、投稿したユーザに帰属します。
本サービスは、ユーザが投稿するテキスト等の情報を、本サービスの円滑な提供、構築、改良、メンテナンスに必要な範囲内で使用することができるものとします。
本サービスが前項に定める形でテキスト等の情報を使用するにあたっては、ユーザが設定している情報の公開の範囲を超える形ではこれを使用しません。
本サービスは、投稿したユーザの許可なく書籍等、本サービス以外で小説の全文を提供できないものとします。
これは
テストです
test
コレは
フォントが縦書きに対応していれば、そのまま縦書きっぽく表示できます。
対応していなければ「こんな感じ」です 文字間がずれる・回転する・左右ずれる・途切れる などが起こります
慶応3年1月5日(新暦2月9日)江戸牛込馬場下横町に生まれる。
慶応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表示のテスト
フォントはSaitamaar(@keageさま作成)を使用
[aa]
~~
[/aa] ←/は半角文字
これはAA表示のテストです。
※中のAAは表示確認用のため、他サイトさまからコピペ
※スマホ閲覧時のオートスケールを確認中
これはAA表示のテストです。
これはAA表示のテストです。
これはAA表示のテストです。
目次 感想へのリンク しおりを挟む