Shinyu Murakami MurakamiShinyu

## review-akabekos-pagedjs-test.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                MurakamiShinyu
                / review-akabekos-pagedjs-test.md
            
            
              Last active
              October 29, 2020 17:17
            
          
    「Paged.js を試す」 @akabekobeko のレビュー

「Paged.js を試す」 @akabekobeko

https://akabeko.me/blog/2020/10/pagedjs/

Vivliostyle サンプル


高瀬舟 (ルビ) - 固定サイズ


## East_Asian_Typographic_Variation_Selectors.md

      
              1 file
            
          
              0 forks
            
          
              1 comment
            
          
              0 stars
            
          
                MurakamiShinyu
                / East_Asian_Typographic_Variation_Selectors.md
            
            
              Last active
              December 17, 2020 07:51
            
              
                文字幅と縦書きの文字の向きを指定する異体字セレクタ（提案）
              
          
    文字幅と縦書きの文字の向きを指定する異体字セレクタ（提案）

名称と略称の案：

East Asian Typographic Variation Selectors (EATVS)
目的

従来フォント依存あるいは処理系依存でありプレーンテキストでは指定することができなかった文字幅や縦書きの文字の向きを特別な異体字セレクタにより指定できるようにする。

文字幅（全角、半角、プロポーショナル）を指定。UAX #11 East_Asian_Width (EAW) プロパティに変更を加える。約物の全角・半角の指定ができる。


## vs-epub.css
@page {
  margin: 8%;
  @bottom-center {
    writing-mode: horizontal-tb;
    font-size: 67%;
    content: "– " counter(page) " –";
  }
}
@page :first {
  margin: 0;

## text-orientation-test.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>text-orientation test</title>
  <style>
:root {
  writing-mode: vertical-rl;
}
.s {

## root-style-inherit-at-page.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Root element styles should be inherited to page context</title>
    <style>
      :root {
        color: maroon;
        font-family: "Georgia", serif;
        font-variant: small-caps;

## root-style-inherit-at-page-multicol.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Root element styles should be inherited to page context</title>
    <style>
      :root {
        color: maroon;
        font-family: "Georgia", serif;
        font-variant: small-caps;

## ruby-page-float-test.html
<!doctype html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <style>
@page {
  size: 560px 790px;
  margin: 63px 72px 63px;
}
html {

## checkDevicePixelRatio.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Check devicePixelRatio</title>
  <script>
    window.onload = () => {
      devicePixelRatioValue.textContent = window.devicePixelRatio;
      actualBorderWidthValue.textContent = testBorder.getBoundingClientRect().height;
    };

## toc-leader.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Test leader() in Table of Contents</title>
    <style>
      @page {
        @bottom-center {
          content: counter(page);
        }

## test-font-kerning-palt-ja.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Test font-kerning and 'palt'</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
:root {
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1.5;
	@page {
	margin: 8%;
	@bottom-center {
	writing-mode: horizontal-tb;
	font-size: 67%;
	content: "– " counter(page) " –";
	}
	}
	@page :first {
	margin: 0;
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>text-orientation test</title>
	<style>
	:root {
	writing-mode: vertical-rl;
	}
	.s {
	<!doctype html>
	<html lang="ja">
	<head>
	<meta charset="utf-8">
	<style>
	@page {
	size: 560px 790px;
	margin: 63px 72px 63px;
	}
	html {
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Check devicePixelRatio</title>
	<script>
	window.onload = () => {
	devicePixelRatioValue.textContent = window.devicePixelRatio;
	actualBorderWidthValue.textContent = testBorder.getBoundingClientRect().height;
	};