| 1 | <?xml version="1.0" encoding="utf-8" ?> |
|---|
| 2 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|---|
| 3 | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|---|
| 4 | <head> |
|---|
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
|---|
| 6 | <meta name="generator" content="Docutils 0.4: http://docutils.sourceforge.net/" /> |
|---|
| 7 | <meta name="version" content="S5 1.1" /> |
|---|
| 8 | <title>第3回社内勉強会</title> |
|---|
| 9 | <style type="text/css"> |
|---|
| 10 | |
|---|
| 11 | /* |
|---|
| 12 | :Author: David Goodger |
|---|
| 13 | :Contact: goodger@users.sourceforge.net |
|---|
| 14 | :Date: $Date: 2005-12-18 01:56:14 +0100 (Sun, 18 Dec 2005) $ |
|---|
| 15 | :Revision: $Revision: 4224 $ |
|---|
| 16 | :Copyright: This stylesheet has been placed in the public domain. |
|---|
| 17 | |
|---|
| 18 | Default cascading style sheet for the HTML output of Docutils. |
|---|
| 19 | |
|---|
| 20 | See http://docutils.sf.net/docs/howto/html-stylesheets.html for how to |
|---|
| 21 | customize this style sheet. |
|---|
| 22 | */ |
|---|
| 23 | |
|---|
| 24 | /* used to remove borders from tables and images */ |
|---|
| 25 | .borderless, table.borderless td, table.borderless th { |
|---|
| 26 | border: 0 } |
|---|
| 27 | |
|---|
| 28 | table.borderless td, table.borderless th { |
|---|
| 29 | /* Override padding for "table.docutils td" with "! important". |
|---|
| 30 | The right padding separates the table cells. */ |
|---|
| 31 | padding: 0 0.5em 0 0 ! important } |
|---|
| 32 | |
|---|
| 33 | .first { |
|---|
| 34 | /* Override more specific margin styles with "! important". */ |
|---|
| 35 | margin-top: 0 ! important } |
|---|
| 36 | |
|---|
| 37 | .last, .with-subtitle { |
|---|
| 38 | margin-bottom: 0 ! important } |
|---|
| 39 | |
|---|
| 40 | .hidden { |
|---|
| 41 | display: none } |
|---|
| 42 | |
|---|
| 43 | a.toc-backref { |
|---|
| 44 | text-decoration: none ; |
|---|
| 45 | color: black } |
|---|
| 46 | |
|---|
| 47 | blockquote.epigraph { |
|---|
| 48 | margin: 2em 5em ; } |
|---|
| 49 | |
|---|
| 50 | dl.docutils dd { |
|---|
| 51 | margin-bottom: 0.5em } |
|---|
| 52 | |
|---|
| 53 | /* Uncomment (and remove this text!) to get bold-faced definition list terms |
|---|
| 54 | dl.docutils dt { |
|---|
| 55 | font-weight: bold } |
|---|
| 56 | */ |
|---|
| 57 | |
|---|
| 58 | div.abstract { |
|---|
| 59 | margin: 2em 5em } |
|---|
| 60 | |
|---|
| 61 | div.abstract p.topic-title { |
|---|
| 62 | font-weight: bold ; |
|---|
| 63 | text-align: center } |
|---|
| 64 | |
|---|
| 65 | div.admonition, div.attention, div.caution, div.danger, div.error, |
|---|
| 66 | div.hint, div.important, div.note, div.tip, div.warning { |
|---|
| 67 | margin: 2em ; |
|---|
| 68 | border: medium outset ; |
|---|
| 69 | padding: 1em } |
|---|
| 70 | |
|---|
| 71 | div.admonition p.admonition-title, div.hint p.admonition-title, |
|---|
| 72 | div.important p.admonition-title, div.note p.admonition-title, |
|---|
| 73 | div.tip p.admonition-title { |
|---|
| 74 | font-weight: bold ; |
|---|
| 75 | font-family: sans-serif } |
|---|
| 76 | |
|---|
| 77 | div.attention p.admonition-title, div.caution p.admonition-title, |
|---|
| 78 | div.danger p.admonition-title, div.error p.admonition-title, |
|---|
| 79 | div.warning p.admonition-title { |
|---|
| 80 | color: red ; |
|---|
| 81 | font-weight: bold ; |
|---|
| 82 | font-family: sans-serif } |
|---|
| 83 | |
|---|
| 84 | /* Uncomment (and remove this text!) to get reduced vertical space in |
|---|
| 85 | compound paragraphs. |
|---|
| 86 | div.compound .compound-first, div.compound .compound-middle { |
|---|
| 87 | margin-bottom: 0.5em } |
|---|
| 88 | |
|---|
| 89 | div.compound .compound-last, div.compound .compound-middle { |
|---|
| 90 | margin-top: 0.5em } |
|---|
| 91 | */ |
|---|
| 92 | |
|---|
| 93 | div.dedication { |
|---|
| 94 | margin: 2em 5em ; |
|---|
| 95 | text-align: center ; |
|---|
| 96 | font-style: italic } |
|---|
| 97 | |
|---|
| 98 | div.dedication p.topic-title { |
|---|
| 99 | font-weight: bold ; |
|---|
| 100 | font-style: normal } |
|---|
| 101 | |
|---|
| 102 | div.figure { |
|---|
| 103 | margin-left: 2em ; |
|---|
| 104 | margin-right: 2em } |
|---|
| 105 | |
|---|
| 106 | div.footer, div.header { |
|---|
| 107 | clear: both; |
|---|
| 108 | font-size: smaller } |
|---|
| 109 | |
|---|
| 110 | div.line-block { |
|---|
| 111 | display: block ; |
|---|
| 112 | margin-top: 1em ; |
|---|
| 113 | margin-bottom: 1em } |
|---|
| 114 | |
|---|
| 115 | div.line-block div.line-block { |
|---|
| 116 | margin-top: 0 ; |
|---|
| 117 | margin-bottom: 0 ; |
|---|
| 118 | margin-left: 1.5em } |
|---|
| 119 | |
|---|
| 120 | div.sidebar { |
|---|
| 121 | margin-left: 1em ; |
|---|
| 122 | border: medium outset ; |
|---|
| 123 | padding: 1em ; |
|---|
| 124 | background-color: #ffffee ; |
|---|
| 125 | width: 40% ; |
|---|
| 126 | float: right ; |
|---|
| 127 | clear: right } |
|---|
| 128 | |
|---|
| 129 | div.sidebar p.rubric { |
|---|
| 130 | font-family: sans-serif ; |
|---|
| 131 | font-size: medium } |
|---|
| 132 | |
|---|
| 133 | div.system-messages { |
|---|
| 134 | margin: 5em } |
|---|
| 135 | |
|---|
| 136 | div.system-messages h1 { |
|---|
| 137 | color: red } |
|---|
| 138 | |
|---|
| 139 | div.system-message { |
|---|
| 140 | border: medium outset ; |
|---|
| 141 | padding: 1em } |
|---|
| 142 | |
|---|
| 143 | div.system-message p.system-message-title { |
|---|
| 144 | color: red ; |
|---|
| 145 | font-weight: bold } |
|---|
| 146 | |
|---|
| 147 | div.topic { |
|---|
| 148 | margin: 2em } |
|---|
| 149 | |
|---|
| 150 | h1.section-subtitle, h2.section-subtitle, h3.section-subtitle, |
|---|
| 151 | h4.section-subtitle, h5.section-subtitle, h6.section-subtitle { |
|---|
| 152 | margin-top: 0.4em } |
|---|
| 153 | |
|---|
| 154 | h1.title { |
|---|
| 155 | text-align: center } |
|---|
| 156 | |
|---|
| 157 | h2.subtitle { |
|---|
| 158 | text-align: center } |
|---|
| 159 | |
|---|
| 160 | hr.docutils { |
|---|
| 161 | width: 75% } |
|---|
| 162 | |
|---|
| 163 | img.align-left { |
|---|
| 164 | clear: left } |
|---|
| 165 | |
|---|
| 166 | img.align-right { |
|---|
| 167 | clear: right } |
|---|
| 168 | |
|---|
| 169 | ol.simple, ul.simple { |
|---|
| 170 | margin-bottom: 1em } |
|---|
| 171 | |
|---|
| 172 | ol.arabic { |
|---|
| 173 | list-style: decimal } |
|---|
| 174 | |
|---|
| 175 | ol.loweralpha { |
|---|
| 176 | list-style: lower-alpha } |
|---|
| 177 | |
|---|
| 178 | ol.upperalpha { |
|---|
| 179 | list-style: upper-alpha } |
|---|
| 180 | |
|---|
| 181 | ol.lowerroman { |
|---|
| 182 | list-style: lower-roman } |
|---|
| 183 | |
|---|
| 184 | ol.upperroman { |
|---|
| 185 | list-style: upper-roman } |
|---|
| 186 | |
|---|
| 187 | p.attribution { |
|---|
| 188 | text-align: right ; |
|---|
| 189 | margin-left: 50% } |
|---|
| 190 | |
|---|
| 191 | p.caption { |
|---|
| 192 | font-style: italic } |
|---|
| 193 | |
|---|
| 194 | p.credits { |
|---|
| 195 | font-style: italic ; |
|---|
| 196 | font-size: smaller } |
|---|
| 197 | |
|---|
| 198 | p.label { |
|---|
| 199 | white-space: nowrap } |
|---|
| 200 | |
|---|
| 201 | p.rubric { |
|---|
| 202 | font-weight: bold ; |
|---|
| 203 | font-size: larger ; |
|---|
| 204 | color: maroon ; |
|---|
| 205 | text-align: center } |
|---|
| 206 | |
|---|
| 207 | p.sidebar-title { |
|---|
| 208 | font-family: sans-serif ; |
|---|
| 209 | font-weight: bold ; |
|---|
| 210 | font-size: larger } |
|---|
| 211 | |
|---|
| 212 | p.sidebar-subtitle { |
|---|
| 213 | font-family: sans-serif ; |
|---|
| 214 | font-weight: bold } |
|---|
| 215 | |
|---|
| 216 | p.topic-title { |
|---|
| 217 | font-weight: bold } |
|---|
| 218 | |
|---|
| 219 | pre.address { |
|---|
| 220 | margin-bottom: 0 ; |
|---|
| 221 | margin-top: 0 ; |
|---|
| 222 | font-family: serif ; |
|---|
| 223 | font-size: 100% } |
|---|
| 224 | |
|---|
| 225 | pre.literal-block, pre.doctest-block { |
|---|
| 226 | margin-left: 2em ; |
|---|
| 227 | margin-right: 2em ; |
|---|
| 228 | background-color: #eeeeee } |
|---|
| 229 | |
|---|
| 230 | span.classifier { |
|---|
| 231 | font-family: sans-serif ; |
|---|
| 232 | font-style: oblique } |
|---|
| 233 | |
|---|
| 234 | span.classifier-delimiter { |
|---|
| 235 | font-family: sans-serif ; |
|---|
| 236 | font-weight: bold } |
|---|
| 237 | |
|---|
| 238 | span.interpreted { |
|---|
| 239 | font-family: sans-serif } |
|---|
| 240 | |
|---|
| 241 | span.option { |
|---|
| 242 | white-space: nowrap } |
|---|
| 243 | |
|---|
| 244 | span.pre { |
|---|
| 245 | white-space: pre } |
|---|
| 246 | |
|---|
| 247 | span.problematic { |
|---|
| 248 | color: red } |
|---|
| 249 | |
|---|
| 250 | span.section-subtitle { |
|---|
| 251 | /* font-size relative to parent (h1..h6 element) */ |
|---|
| 252 | font-size: 80% } |
|---|
| 253 | |
|---|
| 254 | table.citation { |
|---|
| 255 | border-left: solid 1px gray; |
|---|
| 256 | margin-left: 1px } |
|---|
| 257 | |
|---|
| 258 | table.docinfo { |
|---|
| 259 | margin: 2em 4em } |
|---|
| 260 | |
|---|
| 261 | table.docutils { |
|---|
| 262 | margin-top: 0.5em ; |
|---|
| 263 | margin-bottom: 0.5em } |
|---|
| 264 | |
|---|
| 265 | table.footnote { |
|---|
| 266 | border-left: solid 1px black; |
|---|
| 267 | margin-left: 1px } |
|---|
| 268 | |
|---|
| 269 | table.docutils td, table.docutils th, |
|---|
| 270 | table.docinfo td, table.docinfo th { |
|---|
| 271 | padding-left: 0.5em ; |
|---|
| 272 | padding-right: 0.5em ; |
|---|
| 273 | vertical-align: top } |
|---|
| 274 | |
|---|
| 275 | table.docutils th.field-name, table.docinfo th.docinfo-name { |
|---|
| 276 | font-weight: bold ; |
|---|
| 277 | text-align: left ; |
|---|
| 278 | white-space: nowrap ; |
|---|
| 279 | padding-left: 0 } |
|---|
| 280 | |
|---|
| 281 | h1 tt.docutils, h2 tt.docutils, h3 tt.docutils, |
|---|
| 282 | h4 tt.docutils, h5 tt.docutils, h6 tt.docutils { |
|---|
| 283 | font-size: 100% } |
|---|
| 284 | |
|---|
| 285 | tt.docutils { |
|---|
| 286 | background-color: #eeeeee } |
|---|
| 287 | |
|---|
| 288 | ul.auto-toc { |
|---|
| 289 | list-style-type: none } |
|---|
| 290 | |
|---|
| 291 | </style> |
|---|
| 292 | <!-- configuration parameters --> |
|---|
| 293 | <meta name="defaultView" content="slideshow" /> |
|---|
| 294 | <meta name="controlVis" content="hidden" /> |
|---|
| 295 | <!-- style sheet links --> |
|---|
| 296 | <script src="ui/scala_gfx/slides.js" type="text/javascript"></script> |
|---|
| 297 | <link rel="stylesheet" href="ui/scala_gfx/slides.css" |
|---|
| 298 | type="text/css" media="projection" id="slideProj" /> |
|---|
| 299 | <link rel="stylesheet" href="ui/scala_gfx/outline.css" |
|---|
| 300 | type="text/css" media="screen" id="outlineStyle" /> |
|---|
| 301 | <link rel="stylesheet" href="ui/scala_gfx/print.css" |
|---|
| 302 | type="text/css" media="print" id="slidePrint" /> |
|---|
| 303 | <link rel="stylesheet" href="ui/scala_gfx/opera.css" |
|---|
| 304 | type="text/css" media="projection" id="operaFix" /> |
|---|
| 305 | |
|---|
| 306 | <style type="text/css"> |
|---|
| 307 | #currentSlide {display: none;} |
|---|
| 308 | </style> |
|---|
| 309 | </head> |
|---|
| 310 | <body> |
|---|
| 311 | <div class="layout"> |
|---|
| 312 | <div id="controls"></div> |
|---|
| 313 | <div id="currentSlide"></div> |
|---|
| 314 | <div id="header"> |
|---|
| 315 | |
|---|
| 316 | </div> |
|---|
| 317 | <div id="footer"> |
|---|
| 318 | <h1>第3回社内勉強会</h1> |
|---|
| 319 | |
|---|
| 320 | </div> |
|---|
| 321 | </div> |
|---|
| 322 | <div class="presentation"> |
|---|
| 323 | <div class="slide" id="slide0"> |
|---|
| 324 | <h1 class="title">第3回社内勉強会</h1> |
|---|
| 325 | <h2 class="subtitle" id="restructuredtext">reStructuredText勉強会</h2> |
|---|
| 326 | <!-- -*- mode: RST -*- --> |
|---|
| 327 | <!-- RST2S5FLAGS=- -theme-url=ui/scala_gfx --> |
|---|
| 328 | |
|---|
| 329 | </div> |
|---|
| 330 | <div class="slide" id="id2"> |
|---|
| 331 | <h1>これは何?</h1> |
|---|
| 332 | <ul class="simple"> |
|---|
| 333 | <li>テキストドキュメントの文書フォーマットの一つ</li> |
|---|
| 334 | <li>こんな感じ<ul> |
|---|
| 335 | <li><a class="reference" href="03reStructuredText.txt">ソース</a></li> |
|---|
| 336 | </ul> |
|---|
| 337 | </li> |
|---|
| 338 | </ul> |
|---|
| 339 | </div> |
|---|
| 340 | <div class="slide" id="id4"> |
|---|
| 341 | <h1>何が嬉しいの?</h1> |
|---|
| 342 | <ul class="simple"> |
|---|
| 343 | <li>ツールを使って変換できる<ul> |
|---|
| 344 | <li>rst2html<ul> |
|---|
| 345 | <li>そのままウェブページとして公開</li> |
|---|
| 346 | <li>スタイルシートを予め用意しておけば楽チン</li> |
|---|
| 347 | </ul> |
|---|
| 348 | </li> |
|---|
| 349 | <li>rst2s5<ul> |
|---|
| 350 | <li>プレゼンができます → <a class="reference" href="03reStructuredText.x.html">デモ</a></li> |
|---|
| 351 | <li>S5の話は後ほど</li> |
|---|
| 352 | </ul> |
|---|
| 353 | </li> |
|---|
| 354 | <li>rst2latex<ul> |
|---|
| 355 | <li>論文っぽくできる</li> |
|---|
| 356 | <li>印刷の時にいいかも</li> |
|---|
| 357 | </ul> |
|---|
| 358 | </li> |
|---|
| 359 | <li>rst2xml<ul> |
|---|
| 360 | <li>プログラムとかXSLT作って自由に変換</li> |
|---|
| 361 | </ul> |
|---|
| 362 | </li> |
|---|
| 363 | </ul> |
|---|
| 364 | </li> |
|---|
| 365 | <li>ソースはただ一つ!<ul> |
|---|
| 366 | <li>Don't Repeat Yourself!! D・R・Y!! D・R・Y!!(違</li> |
|---|
| 367 | </ul> |
|---|
| 368 | </li> |
|---|
| 369 | <li><strong>[これはすごい]</strong></li> |
|---|
| 370 | </ul> |
|---|
| 371 | </div> |
|---|
| 372 | <div class="slide" id="id6"> |
|---|
| 373 | <h1>他には何が嬉しいの?</h1> |
|---|
| 374 | <ul class="simple"> |
|---|
| 375 | <li>ソースが <strong>読める</strong><ul> |
|---|
| 376 | <li>メールにそのまま貼れちゃう</li> |
|---|
| 377 | <li>reStructuredText形式で書かれていたことに |
|---|
| 378 | 気付かなかったこともあるほど</li> |
|---|
| 379 | </ul> |
|---|
| 380 | </li> |
|---|
| 381 | <li><strong>[これはすごい]</strong></li> |
|---|
| 382 | </ul> |
|---|
| 383 | </div> |
|---|
| 384 | <div class="slide" id="id7"> |
|---|
| 385 | <h1>ちょっと技術寄りの話</h1> |
|---|
| 386 | <ul class="simple"> |
|---|
| 387 | <li>構造化テキスト</li> |
|---|
| 388 | <li>マークアップ言語<ul> |
|---|
| 389 | <li>テキストに構造を与える</li> |
|---|
| 390 | <li>テキストに意味付けを行う</li> |
|---|
| 391 | </ul> |
|---|
| 392 | </li> |
|---|
| 393 | <li>Pythonの公式文書フォーマット<ul> |
|---|
| 394 | <li>先のツール群はPython製の <a class="reference" href="http://docutils.sourceforge.net/">Docutils(Documentation Utilities)</a> に含まれている</li> |
|---|
| 395 | </ul> |
|---|
| 396 | </li> |
|---|
| 397 | <li>外観は他の「ほとんどプレーンテキストなフォーマット」に似ている<ul> |
|---|
| 398 | <li>Wiki類</li> |
|---|
| 399 | <li>はてな記法</li> |
|---|
| 400 | </ul> |
|---|
| 401 | </li> |
|---|
| 402 | <li>セマンティクスはXMLに似ている</li> |
|---|
| 403 | </ul> |
|---|
| 404 | </div> |
|---|
| 405 | <div class="slide" id="id8"> |
|---|
| 406 | <h1>何が違う?</h1> |
|---|
| 407 | <ul class="simple"> |
|---|
| 408 | <li>HTML<ul> |
|---|
| 409 | <li>手で書くのはちょっと大変</li> |
|---|
| 410 | </ul> |
|---|
| 411 | </li> |
|---|
| 412 | <li>XML<ul> |
|---|
| 413 | <li>人間が手で書くもんじゃない<ul> |
|---|
| 414 | <li>当初の「XMLはHuman Readableだ」って話は絶対嘘だと思う</li> |
|---|
| 415 | <li>XMLで書かれた設定ファイルとか読みたくないし</li> |
|---|
| 416 | </ul> |
|---|
| 417 | </li> |
|---|
| 418 | <li>マークアップのルールどうする?</li> |
|---|
| 419 | </ul> |
|---|
| 420 | </li> |
|---|
| 421 | <li>YAML<ul> |
|---|
| 422 | <li>書くのは比較的楽</li> |
|---|
| 423 | <li>マークアップのルールどうする?</li> |
|---|
| 424 | <li>シンプル過ぎて細かいマークアップが大変</li> |
|---|
| 425 | </ul> |
|---|
| 426 | </li> |
|---|
| 427 | </ul> |
|---|
| 428 | </div> |
|---|
| 429 | <div class="slide" id="id9"> |
|---|
| 430 | <h1>何が違う?</h1> |
|---|
| 431 | <ul class="simple"> |
|---|
| 432 | <li>DocBook<ul> |
|---|
| 433 | <li>XMLベース</li> |
|---|
| 434 | <li>書くのが <strong>超本気で</strong> しんどい!<ul> |
|---|
| 435 | <li>HTMLで足りないと思う要素全部作っちゃいました♪みたいなノリ</li> |
|---|
| 436 | <li>XHTML1.1より酷いぉ(^ω^;)</li> |
|---|
| 437 | </ul> |
|---|
| 438 | </li> |
|---|
| 439 | </ul> |
|---|
| 440 | </li> |
|---|
| 441 | <li>TeX,LaTeX<ul> |
|---|
| 442 | <li>書くの難しい</li> |
|---|
| 443 | <li>マクロで拡張<ul> |
|---|
| 444 | <li>先輩から受け継ぐ伝統のマクロ</li> |
|---|
| 445 | <li>マクロの嵐</li> |
|---|
| 446 | <li>ソース汚い</li> |
|---|
| 447 | </ul> |
|---|
| 448 | </li> |
|---|
| 449 | </ul> |
|---|
| 450 | </li> |
|---|
| 451 | </ul> |
|---|
| 452 | </div> |
|---|
| 453 | <div class="slide" id="id10"> |
|---|
| 454 | <h1>文書構造</h1> |
|---|
| 455 | <pre class="literal-block"> |
|---|
| 456 | ============ |
|---|
| 457 | 文書タイトル |
|---|
| 458 | ============ |
|---|
| 459 | |
|---|
| 460 | ---------------- |
|---|
| 461 | 文書サブタイトル |
|---|
| 462 | ---------------- |
|---|
| 463 | |
|---|
| 464 | 第1章 |
|---|
| 465 | ===== |
|---|
| 466 | |
|---|
| 467 | 第1節 |
|---|
| 468 | ----- |
|---|
| 469 | </pre> |
|---|
| 470 | <p><tt class="docutils literal"><span class="pre">=</span> <span class="pre">-</span> <span class="pre">`</span> <span class="pre">:</span> <span class="pre">'</span> <span class="pre">"</span> <span class="pre">~</span> <span class="pre">^</span> <span class="pre">_</span> <span class="pre">*</span> <span class="pre">+</span> <span class="pre">#</span> <span class="pre"><</span> <span class="pre">></span></tt> どれ使ってもいい</p> |
|---|
| 471 | </div> |
|---|
| 472 | <div class="slide" id="id11"> |
|---|
| 473 | <h1>段落</h1> |
|---|
| 474 | <pre class="literal-block"> |
|---|
| 475 | 段落 |
|---|
| 476 | |
|---|
| 477 | 引用段落 |
|---|
| 478 | |
|---|
| 479 | 段落 |
|---|
| 480 | </pre> |
|---|
| 481 | <p>段落</p> |
|---|
| 482 | <blockquote> |
|---|
| 483 | 引用段落</blockquote> |
|---|
| 484 | <p>段落</p> |
|---|
| 485 | <ul class="simple"> |
|---|
| 486 | <li>空行大事</li> |
|---|
| 487 | <li>インデント大事</li> |
|---|
| 488 | </ul> |
|---|
| 489 | </div> |
|---|
| 490 | <div class="slide" id="id12"> |
|---|
| 491 | <h1>句要素</h1> |
|---|
| 492 | <table border="1" class="docutils"> |
|---|
| 493 | <colgroup> |
|---|
| 494 | <col width="44%" /> |
|---|
| 495 | <col width="36%" /> |
|---|
| 496 | <col width="20%" /> |
|---|
| 497 | </colgroup> |
|---|
| 498 | <thead valign="bottom"> |
|---|
| 499 | <tr><th class="head">reStructuredText</th> |
|---|
| 500 | <th class="head">HTML</th> |
|---|
| 501 | <th class="head">HTML要素</th> |
|---|
| 502 | </tr> |
|---|
| 503 | </thead> |
|---|
| 504 | <tbody valign="top"> |
|---|
| 505 | <tr><td>*強調*</td> |
|---|
| 506 | <td><em>強調</em></td> |
|---|
| 507 | <td>em</td> |
|---|
| 508 | </tr> |
|---|
| 509 | <tr><td>**より強い強調**</td> |
|---|
| 510 | <td><strong>より強い強調</strong></td> |
|---|
| 511 | <td>strong</td> |
|---|
| 512 | </tr> |
|---|
| 513 | </tbody> |
|---|
| 514 | </table> |
|---|
| 515 | <ul class="simple"> |
|---|
| 516 | <li>他にもあるけどあんま使わないので省略</li> |
|---|
| 517 | </ul> |
|---|
| 518 | </div> |
|---|
| 519 | <div class="slide" id="id13"> |
|---|
| 520 | <h1>リスト - 順不同リスト</h1> |
|---|
| 521 | <pre class="literal-block"> |
|---|
| 522 | - 項目1 |
|---|
| 523 | - 項目2 |
|---|
| 524 | |
|---|
| 525 | - 項目2-1 |
|---|
| 526 | - 項目2-2 |
|---|
| 527 | |
|---|
| 528 | - 項目3 |
|---|
| 529 | </pre> |
|---|
| 530 | <ul class="simple"> |
|---|
| 531 | <li>項目1</li> |
|---|
| 532 | <li>項目2<ul> |
|---|
| 533 | <li>項目2-1</li> |
|---|
| 534 | <li>項目2-2</li> |
|---|
| 535 | </ul> |
|---|
| 536 | </li> |
|---|
| 537 | <li>項目3</li> |
|---|
| 538 | </ul> |
|---|
| 539 | <p><tt class="docutils literal"><span class="pre">+</span> <span class="pre">*</span></tt> なども使える</p> |
|---|
| 540 | </div> |
|---|
| 541 | <div class="slide" id="id14"> |
|---|
| 542 | <h1>リスト - 序列リスト</h1> |
|---|
| 543 | <pre class="literal-block"> |
|---|
| 544 | 1. 項目1 |
|---|
| 545 | |
|---|
| 546 | a. 項目1-a |
|---|
| 547 | b. 項目1-b |
|---|
| 548 | |
|---|
| 549 | 2. 項目2 |
|---|
| 550 | </pre> |
|---|
| 551 | <ol class="arabic simple"> |
|---|
| 552 | <li>項目1<ol class="loweralpha"> |
|---|
| 553 | <li>項目1-a</li> |
|---|
| 554 | <li>項目1-b</li> |
|---|
| 555 | </ol> |
|---|
| 556 | </li> |
|---|
| 557 | <li>項目2</li> |
|---|
| 558 | </ol> |
|---|
| 559 | <p><tt class="docutils literal"><span class="pre">A.</span> <span class="pre">I.</span> <span class="pre">i.</span> <span class="pre">(1)</span> <span class="pre">1)</span></tt> なども使える</p> |
|---|
| 560 | </div> |
|---|
| 561 | <div class="slide" id="id15"> |
|---|
| 562 | <h1>リスト - 定義リスト</h1> |
|---|
| 563 | <pre class="literal-block"> |
|---|
| 564 | 定義名1 |
|---|
| 565 | 定義1の内容 |
|---|
| 566 | |
|---|
| 567 | 定義名2 |
|---|
| 568 | 定義2の内容 |
|---|
| 569 | </pre> |
|---|
| 570 | <dl class="docutils"> |
|---|
| 571 | <dt>定義名1</dt> |
|---|
| 572 | <dd>定義1の内容</dd> |
|---|
| 573 | <dt>定義名2</dt> |
|---|
| 574 | <dd>定義2の内容</dd> |
|---|
| 575 | </dl> |
|---|
| 576 | </div> |
|---|
| 577 | <div class="slide" id="id16"> |
|---|
| 578 | <h1>整形済みブロック</h1> |
|---|
| 579 | <pre class="literal-block"> |
|---|
| 580 | :: |
|---|
| 581 | |
|---|
| 582 | - *整形* **済み** |
|---|
| 583 | </pre> |
|---|
| 584 | <pre class="literal-block"> |
|---|
| 585 | - *整形* **済み** |
|---|
| 586 | </pre> |
|---|
| 587 | </div> |
|---|
| 588 | <div class="slide" id="id17"> |
|---|
| 589 | <h1>表</h1> |
|---|
| 590 | <pre class="literal-block"> |
|---|
| 591 | +--+--+--+ |
|---|
| 592 | |a |b |c | |
|---|
| 593 | +==+==+==+ |
|---|
| 594 | |1 |2 |v | |
|---|
| 595 | +--+--+ + |
|---|
| 596 | |> < |^ | |
|---|
| 597 | +--+--+--+ |
|---|
| 598 | </pre> |
|---|
| 599 | <table border="1" class="docutils"> |
|---|
| 600 | <colgroup> |
|---|
| 601 | <col width="33%" /> |
|---|
| 602 | <col width="33%" /> |
|---|
| 603 | <col width="33%" /> |
|---|
| 604 | </colgroup> |
|---|
| 605 | <thead valign="bottom"> |
|---|
| 606 | <tr><th class="head">a</th> |
|---|
| 607 | <th class="head">b</th> |
|---|
| 608 | <th class="head">c</th> |
|---|
| 609 | </tr> |
|---|
| 610 | </thead> |
|---|
| 611 | <tbody valign="top"> |
|---|
| 612 | <tr><td>1</td> |
|---|
| 613 | <td>2</td> |
|---|
| 614 | <td rowspan="2"><p class="first">v</p> |
|---|
| 615 | <p class="last">^</p> |
|---|
| 616 | </td> |
|---|
| 617 | </tr> |
|---|
| 618 | <tr><td colspan="2">> <</td> |
|---|
| 619 | </tr> |
|---|
| 620 | </tbody> |
|---|
| 621 | </table> |
|---|
| 622 | </div> |
|---|
| 623 | <div class="slide" id="id18"> |
|---|
| 624 | <h1>シンプルな表</h1> |
|---|
| 625 | <pre class="literal-block"> |
|---|
| 626 | == == == |
|---|
| 627 | a b c |
|---|
| 628 | == == == |
|---|
| 629 | 1 2 v |
|---|
| 630 | > < ^ |
|---|
| 631 | ===== == |
|---|
| 632 | </pre> |
|---|
| 633 | <table border="1" class="docutils"> |
|---|
| 634 | <colgroup> |
|---|
| 635 | <col width="33%" /> |
|---|
| 636 | <col width="33%" /> |
|---|
| 637 | <col width="33%" /> |
|---|
| 638 | </colgroup> |
|---|
| 639 | <thead valign="bottom"> |
|---|
| 640 | <tr><th class="head">a</th> |
|---|
| 641 | <th class="head">b</th> |
|---|
| 642 | <th class="head">c</th> |
|---|
| 643 | </tr> |
|---|
| 644 | </thead> |
|---|
| 645 | <tbody valign="top"> |
|---|
| 646 | <tr><td>1</td> |
|---|
| 647 | <td>2</td> |
|---|
| 648 | <td>v</td> |
|---|
| 649 | </tr> |
|---|
| 650 | <tr><td colspan="2">> <</td> |
|---|
| 651 | <td>^</td> |
|---|
| 652 | </tr> |
|---|
| 653 | </tbody> |
|---|
| 654 | </table> |
|---|
| 655 | <ul class="simple"> |
|---|
| 656 | <li>シンプル</li> |
|---|
| 657 | <li>縦につなげることができない</li> |
|---|
| 658 | </ul> |
|---|
| 659 | </div> |
|---|
| 660 | <div class="slide" id="id19"> |
|---|
| 661 | <h1>リンク</h1> |
|---|
| 662 | <pre class="literal-block"> |
|---|
| 663 | `Example Web Page <http://example.com>`_ |
|---|
| 664 | </pre> |
|---|
| 665 | <p><a class="reference" href="http://example.com">Example Web Page</a></p> |
|---|
| 666 | </div> |
|---|
| 667 | <div class="slide" id="id20"> |
|---|
| 668 | <h1>画像</h1> |
|---|
| 669 | <pre class="literal-block"> |
|---|
| 670 | .. image:: ui/scala_gfx/audio_on.png |
|---|
| 671 | </pre> |
|---|
| 672 | <img alt="ui/scala_gfx/audio_on.png" src="ui/scala_gfx/audio_on.png" /> |
|---|
| 673 | <ul class="simple"> |
|---|
| 674 | <li><tt class="docutils literal"><span class="pre">..</span> <span class="pre">○○::</span></tt> ← ディレクティブ</li> |
|---|
| 675 | <li>拡張も可能</li> |
|---|
| 676 | </ul> |
|---|
| 677 | </div> |
|---|
| 678 | <div class="slide" id="id21"> |
|---|
| 679 | <h1>その他</h1> |
|---|
| 680 | <dl class="docutils"> |
|---|
| 681 | <dt>罫線</dt> |
|---|
| 682 | <dd><tt class="docutils literal"><span class="pre">----</span></tt></dd> |
|---|
| 683 | <dt>脚注</dt> |
|---|
| 684 | <dd><tt class="docutils literal"><span class="pre">[1]_</span></tt></dd> |
|---|
| 685 | <dt>自動採番脚注</dt> |
|---|
| 686 | <dd><tt class="docutils literal"><span class="pre">[#]_</span></tt> |
|---|
| 687 | <tt class="docutils literal"><span class="pre">[*]_</span></tt></dd> |
|---|
| 688 | <dt>コメント</dt> |
|---|
| 689 | <dd><pre class="first last literal-block"> |
|---|
| 690 | .. コメント |
|---|
| 691 | ここもコメント |
|---|
| 692 | </pre> |
|---|
| 693 | </dd> |
|---|
| 694 | <dt>エスケープ</dt> |
|---|
| 695 | <dd>\*強調じゃない\*</dd> |
|---|
| 696 | </dl> |
|---|
| 697 | </div> |
|---|
| 698 | <div class="slide" id="s5"> |
|---|
| 699 | <h1>S5</h1> |
|---|
| 700 | <ul class="simple"> |
|---|
| 701 | <li><strong>S</strong> imple <strong>S</strong> tandards-based <strong>S</strong> lide <strong>S</strong> how <strong>S</strong> ystem</li> |
|---|
| 702 | <li>特殊なidやclassを付加した1枚のHTMLがあれば |
|---|
| 703 | スライド式のプレゼンテーションができる<ul> |
|---|
| 704 | <li>資料をそのままウェブで公開できる</li> |
|---|
| 705 | <li>見る方は特殊なプラグイン・ソフトウェアが不要(ブラウザさえあれば見れる)</li> |
|---|
| 706 | </ul> |
|---|
| 707 | </li> |
|---|
| 708 | <li>Q.他にも似たようなツールはいっぱいあるけど何故S5?<ul> |
|---|
| 709 | <li>A.reStructuredTextから簡単に生成できるから</li> |
|---|
| 710 | </ul> |
|---|
| 711 | </li> |
|---|
| 712 | </ul> |
|---|
| 713 | </div> |
|---|
| 714 | <div class="slide" id="s5-reloaded"> |
|---|
| 715 | <h1>S5 Reloaded</h1> |
|---|
| 716 | <ul class="simple"> |
|---|
| 717 | <li>このプレゼンは <cite>S5 Reloaded 1.3b7</cite> を使用してます</li> |
|---|
| 718 | <li>モダンブラウザに対応<ul> |
|---|
| 719 | <li>対応ブラウザ<ul> |
|---|
| 720 | <li>SeaMonkey</li> |
|---|
| 721 | <li>Mozilla</li> |
|---|
| 722 | <li>Firefox</li> |
|---|
| 723 | <li>Netscape</li> |
|---|
| 724 | <li>K-Meleon</li> |
|---|
| 725 | <li>Epiphany</li> |
|---|
| 726 | <li>Camino</li> |
|---|
| 727 | <li>Safari</li> |
|---|
| 728 | <li>Shiira</li> |
|---|
| 729 | <li>Konqueror</li> |
|---|
| 730 | <li>Opera 9</li> |
|---|
| 731 | </ul> |
|---|
| 732 | </li> |
|---|
| 733 | <li>つまり、IE <strong>以外</strong> (笑)</li> |
|---|
| 734 | <li>IEは対応作業中らしい</li> |
|---|
| 735 | </ul> |
|---|
| 736 | </li> |
|---|
| 737 | </ul> |
|---|
| 738 | </div> |
|---|
| 739 | <div class="slide" id="s5-s5-reloaded"> |
|---|
| 740 | <h1>S5(S5 Reloaded)の使い方</h1> |
|---|
| 741 | <ul class="simple"> |
|---|
| 742 | <li>uiフォルダを直下にコピー</li> |
|---|
| 743 | <li>rst2s5でS5ファイルを作る<ul> |
|---|
| 744 | <li><tt class="docutils literal"><span class="pre">--theme-url=テーマ</span></tt> でテーマを指定できる</li> |
|---|
| 745 | <li>テーマ自作も可能</li> |
|---|
| 746 | </ul> |
|---|
| 747 | </li> |
|---|
| 748 | <li>テーマ切り替えデモ</li> |
|---|
| 749 | </ul> |
|---|
| 750 | <div class="section" id="id22"> |
|---|
| 751 | <h2>注意</h2> |
|---|
| 752 | <ul class="simple"> |
|---|
| 753 | <li>S5 Reloaded は application/xhtml+xml では動かない(><)のでtext/htmlで。<ul> |
|---|
| 754 | <li>拡張子を.xhtmlではなく.x.htmlにしてます</li> |
|---|
| 755 | </ul> |
|---|
| 756 | </li> |
|---|
| 757 | </ul> |
|---|
| 758 | </div> |
|---|
| 759 | </div> |
|---|
| 760 | <div class="slide" id="id23"> |
|---|
| 761 | <h1>3分で作る即興プレゼンアプリ</h1> |
|---|
| 762 | <ul> |
|---|
| 763 | <li><p class="first"><a class="reference" href="http://localhost:3000/">3分で作る即興プレゼンアプリ</a></p> |
|---|
| 764 | <ul> |
|---|
| 765 | <li><dl class="first docutils"> |
|---|
| 766 | <dt>Catalyst</dt> |
|---|
| 767 | <dd><p class="first">ソース:</p> |
|---|
| 768 | <pre class="last literal-block"> |
|---|
| 769 | sub rst2s5 : Local { |
|---|
| 770 | my ( $self, $c ) = @_; |
|---|
| 771 | use IO::All; |
|---|
| 772 | $c->req->param('rst') > io('/tmp/rst'); |
|---|
| 773 | my $s5 = `rst2s5.py /tmp/rst`; |
|---|
| 774 | $c->res->body($s5); |
|---|
| 775 | } |
|---|
| 776 | </pre> |
|---|
| 777 | </dd> |
|---|
| 778 | </dl> |
|---|
| 779 | </li> |
|---|
| 780 | </ul> |
|---|
| 781 | </li> |
|---|
| 782 | </ul> |
|---|
| 783 | </div> |
|---|
| 784 | <div class="slide" id="id25"> |
|---|
| 785 | <h1>終わりに</h1> |
|---|
| 786 | <p>ご清聴ありがとうございました。</p> |
|---|
| 787 | <ul class="simple"> |
|---|
| 788 | <li>リンク集<ul> |
|---|
| 789 | <li><a class="reference" href="http://docutils.sourceforge.net/rst.html">reStructuredText</a></li> |
|---|
| 790 | <li><a class="reference" href="http://meyerweb.com/eric/tools/s5/">S5: A Simple Standards-Based Slide Show System</a></li> |
|---|
| 791 | <li><a class="reference" href="http://www.netzgesta.de/S5/">S5 Reloaded . Enhanced version of the browser-based presentation slideshow system</a></li> |
|---|
| 792 | </ul> |
|---|
| 793 | </li> |
|---|
| 794 | </ul> |
|---|
| 795 | <script type="text/javascript"> |
|---|
| 796 | var head = document.getElementsByTagName('head')[0]; |
|---|
| 797 | var configuration = {tranSitions:true, |
|---|
| 798 | fadeDuration:500, |
|---|
| 799 | incrDuration:250, |
|---|
| 800 | autoMatic:false, |
|---|
| 801 | playLoop:true, |
|---|
| 802 | playDelay:10, |
|---|
| 803 | audioSupport:true, |
|---|
| 804 | audioVolume:100, |
|---|
| 805 | audioError:true, |
|---|
| 806 | audioDebug:false}; |
|---|
| 807 | for (var name in configuration) { |
|---|
| 808 | var meta = document.createElement('meta'); |
|---|
| 809 | meta.setAttribute('name', name); |
|---|
| 810 | meta.setAttribute('content', configuration[name]); |
|---|
| 811 | head.appendChild(meta); |
|---|
| 812 | } |
|---|
| 813 | |
|---|
| 814 | var e=document.getElementsByTagName('ul'); |
|---|
| 815 | for (var i = 0; i < e.length; ++i) { |
|---|
| 816 | e[i].className += ' incremental'; |
|---|
| 817 | // e[i].className += ' scale fs90'; |
|---|
| 818 | } |
|---|
| 819 | |
|---|
| 820 | try { |
|---|
| 821 | var style = document.createElement('style'); |
|---|
| 822 | style.innerHTML = ['* {font-family: "MS PGothic",sans-serif}' |
|---|
| 823 | ,'pre,tt {font-family: "MS Gothic",monospace}' |
|---|
| 824 | ,'.slide pre {color:black}' |
|---|
| 825 | ,'.slide tt {color:black}' |
|---|
| 826 | ,'.slide .incremental, .slide .incremental *, .slide .incremental *:after {visibility: hidden;}' |
|---|
| 827 | ].join('\n'); |
|---|
| 828 | head.appendChild(style); |
|---|
| 829 | } catch(e) {} |
|---|
| 830 | </script></div> |
|---|
| 831 | </div> |
|---|
| 832 | </body> |
|---|
| 833 | </html> |
|---|