PowerPoint 프레젠테이션

Size: px

Start display at page:

Download "PowerPoint 프레젠테이션"

수 탁
6 years ago
Views:

1 How to construct XSL and/or CSS for style sheet of XML files based on the data type definition 조윤상 ( 과편협기획운영위원 ) 1

2 Table of Contents 1. XML, XSL and CSS? 2. What is XSL? XSLT? XPath? XSL-FO? 3. What is CSS? CSS Syntax How to use CSS? 2 15 th KCSE Editor s Workshop, Seoul 2015

3 XML? XML (Extensible Markup Language) 이란? 확장가능한마크업언어. 모양보다는내용과구조를표시하는 tag. 문법규칙이엄격. 다른형태로의변환에있어용이함.(DataBase Dump, PubReader, epub(ebook), PDF) Markup( 마크업 ) : 문서의논리적구조와배치양식에대한정보를표현하는것. DTD (Document Type Definition)? 문서형정의 : 문서에대한논리적구조 / 형태를정의 DTD 구성요소 1. Element 2. Attribute 3. Value <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE note SYSTEM "Note.dtd"> <person sex="male"> <firstname>gildong</firstname> <lastname>hong</lastname> </person> 위세가지에대한구조를정해놓고, XML 파일에 DTD 가연결이되면, DTD 로정의되어있는구조를따라야한다 th KCSE Editor s Workshop, Seoul 2015

4 XML Tree structure XML document 는 root" 부터시작하고 leaves" 로확장되는트리구조 ArticleSet Article Article Journal ArticleTitle AuthorList ArticleIdList History Title Volume Issue PubDate Received date Accepted date Publish date Year Month Day Year Month Day 4 15 th KCSE Editor s Workshop, Seoul 2015

5 Example of XML Tree structure Folder shows tree structure ` XML Document shows tree structure 5 15 th KCSE Editor s Workshop, Seoul 2015

6 XML, XSL and CSS? The following shows the relationship between XSL and CSS files XML document XSL transformation XHTML output + CSS layout 6 15 th KCSE Editor s Workshop, Seoul 2015

7 What is XSL? XSL(eXtensible Style Language)? XML 문서를변환하고, 포맷팅정보를기술하기위해개발된 stylesheet 언어 XSL/XSLT 는기존의 XML 문서를다른형태의 XML 로변환하거나, 혹은 XML 문서를 HTML 이나그외의문서로변환하고자할때사용 원본문서는변화가없고새로운형식의문서를만들수있는기능을제공 원본 XML 문서는그대로있으면서, XSL 를이용하여원하는형태로변환하여사용함 The following shows difference between CSS and XSL CSS (Style Sheets for HTML) XSL (Style Sheets for XML) Tag 의정의 uses predefined tags does not use predefined tags tag 의의미 each tag is well understood each tag is not well understood 브라우저표시방법 browser knows how to display it browser does not know how to display it 7 15 th KCSE Editor s Workshop, Seoul

8 XSL? XSL 기술을구성하는세가지언어 1. XSLT (XSL Transformations) - XML 문서를구조가다른 XML 문서등으로변환하기위한 XML 기반의마크업언어 2. XPath (XML Path Language) - XML 문서의특정부분 ( 요소, 속성, 텍스트등 ) 을지정하는언어. - XPath 는 XSLT 에서처리할 XML 문서의특정부분을지정하는데사용되고있음. 3. XSL-FO (XSL Formatting Objects ) - XSL-FO 는 XML 데이터를포맷팅하기위한언어. - 인간에게이해가능한형식의문서조판을설명하는 XML 기반의마크업언어. XSL Transforming Language XSLT Navigation Language XPath FO (Formatting object) XSL-FO HTML CSS 8 15 th KCSE Editor s Workshop, Seoul 2015

XSLT XSLT(XSL Transformations)? XSL의가장중요한부분 XML 문서를다른포맷의문서로변환하는언어 XPath를사용하여 XML 문서에서이동 W3C 권고안 - 새로운요소를추가하거나기존에존재하는요소들을제거할수있다. - XML 문서에존재하는요소들은 XSLT 에의해정렬되거나재배열될수있으 며보여지거나감춰질수있다.

9 XSLT XSLT(XSL Transformations)? XSL의가장중요한부분 XML 문서를다른포맷의문서로변환하는언어 XPath를사용하여 XML 문서에서이동 W3C 권고안 - 새로운요소를추가하거나기존에존재하는요소들을제거할수있다. - XML 문서에존재하는요소들은 XSLT 에의해정렬되거나재배열될수있으 며보여지거나감춰질수있다. XSL Stylesheet 선언 <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns:xsl=" XSL Stylesheet 문서연결 <?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href="example1.xsl"?> 9 15 th KCSE Editor s Workshop, Seoul 2015

10 How to transform XML using XSLT into XHTML XML Document example1.xml <?xml version="1.0" encoding="utf-8"?> <articles> <article> <title>biochemia Medica indexed in PubMed Central (PMC)</title> <corresp>ana-maria Simundic</corresp> <pub_year>2014</pub_year> <volume>24</volume> <issue>1</issue> <fpage>5</fpage> </article> <article> <title>preanalytical Phase - an updated review of the current evidence</title> <corresp>ana-maria Simundic</corresp> <pub_year>2014</pub_year> <volume>24</volume> <issue>1</issue> <fpage>6</fpage> </article> </articles> th KCSE Editor s Workshop, Seoul 2015

11 How to transform XML using XSLT into XHTML XSL Style Sheet 생성 example1.xsl <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns:xsl=" <xsl:template match="/"> Document Declaration <html> <body> <h2>article List - Sample 1</h2> <table border="1"> <tr bgcolor="#3399cc"> XPath expression <th>title</th> <th>corresponding author</th> <th>pubyear</th> <th>volume</th> <th>issue</th> <th>firstpage</th> </tr> <xsl:for-each select="articles/article"> <tr> <td><xsl:value-of select="title"/></td> <td><xsl:value-of select="corresp"/></td> <td><xsl:value-of select="pub_year"/></td> <td><xsl:value-of select="volume"/></td> <td><xsl:value-of select="issue"/></td> <td><xsl:value-of select="fpage"/></td> </tr> </xsl:for-each> </table> </body> <xsl:value-of> Element </html> </xsl:template> </xsl:stylesheet> <?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href="example1.xsl"?> <articles> <article> <title>biochemia Medica indexed in PubMed Central (PMC)</title> <corresp>ana-maria Simundic</corresp> <pub_year>2014</pub_year> <volume>24</volume> <issue>1</issue> <fpage>5</fpage> </article>. </articles> th KCSE Editor s Workshop, Seoul 2015

12 What is XPath XPath (XML Path Language)? ML 문서에특정 element나 attribute에접근하기위한경로를지정하는언어. XSLT의주요요소 W3C 권고안 XML문서는트리구조로구조화되어있기에.. 특정부분에접근하기위해 XPath라는 [ 약속된경로표기법 ] 을사용한다 XPath는 XML 문서의 nodes 또는 node-sets를선택하는경로표현을위해사용 th KCSE Editor s Workshop, Seoul 2015

13 XPath 용어 - Nodes Seven kinds of nodes - element ArticleSet - attribute Article Article Journal - text - namespace - processing-instruction AuthorID List ArticleTitle FirstPage AccepdDate Issn Volume - comment - document nodes IdType Preanalytical Phase element nodes attribute nodes text nodes <articles> root element node <article> <title lang= en >Biochemia Medica indexed in PubMed Central (PMC)</title> <corresp>ana-maria Simundic</corresp> element node attribute node th KCSE Editor s Workshop, Seoul 2015

14 Example of XPath Article List path="/articles/article[1]/title //article[1]/volume"; path="/articles/article[1]/*"; Example1 /articles/article[1]/title Example2 /articles/article[pub_year>2013]/title th KCSE Editor s Workshop, Seoul 2015

15 What is XSL-FO? XSL-FO? XML 데이터를포맷팅하기위한언어 EXtensible Stylesheet Language Formatting Objects XML 에근거함 W3C 권고안 XSL-FO 는 XML 데이터를화면, 종이또는다른미디어에출력하기위한포맷팅을기술한 XML 기반마크업언어이다. XML document XSLT processor FO document FO procesor Final document (PDF, Print) XSL style th KCSE Editor s Workshop, Seoul 2015

16 XML, XSLT and XSL-FO XML FO-Document PDF Dcoument Formatter FO-XSLT th KCSE Editor s Workshop, Seoul

17 What is CSS? CSS? - A stands for Cascading Style Sheets HTML 4.0 부터추가된문서전체의레이아웃을향상시킬수있는언어. 발전된디자인과동적인형식을부여할수있도록해준다. 전체웹페이지의관련된요소들의스타일속성을한꺼번에변경시킬수있어페이지유지관리시간을단축시킬수있다. What is CSS. Available from : [cited-by 2014 November 15] th KCSE Editor s Workshop, Seoul 2015

18 CSS Syntax CSS 구문의 3 가지구성요소 CSS 적용후 Selector ( 선택자 ) Property ( 속성 ) Value ( 값 ) CSS 적용전 th KCSE Editor s Workshop, Seoul 2015

19 How to use CSS CSS 삽입하는방법 1.External Style Sheet <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> 2.Internal style sheet <head> <style> hr {color:sienna;} p {margin-left:20px;} body {background-image:url("images/background.gif");} </style> </head> 3.Inline style sheet <p style="color:sienna;margin-left:20px;">this is a paragraph.</p> th KCSE Editor s Workshop, Seoul 2015

20 CSS selectors? CSS selectors 는선언된 CSS 가어디에적용될지가리키는역할을함 CSS selectors 형식 id, classes, types, attributes, values of attributes etc. h1 { text-align:center; color:red; } h2 { text-align:center; color:red; } p { text-align:center; color:red; } h1,h2,p { text-align:center; color:red; } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " transitional.dtd"> <style>. </style> </head> <body> <h1>publisher : Croatian Society of Medical Biochemistry and Laboratory Medicine</h1> <h2>journal Title : Biochemia Medica</h2> <p>title : Biochemia Medica indexed in PubMed Central (PMC)</p> </body> </html> th KCSE Editor s Workshop, Seoul 2015

21 Example - 2 pubmed.xml <?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href="pubmed_list.xsl"?> <ArticleSet> <Article> <Journal> <PublisherName>Croatian Society of Medical Biochemistry and Laboratory Medicine</PublisherName> <JournalTitle>Biochemia Medica</JournalTitle> <Issn> </Issn> <Volume>24</Volume> <Issue>1</Issue> <PubDate> <Year>2014</Year> <Month>2</Month> </PubDate> </Journal> <ArticleTitle>Biochemia Medica indexed in PubMed Central (PMC)</ArticleTitle> <FirstPage>5</FirstPage> <LastPage>5</LastPage> <Language>EN</Language> <AuthorList> <Author> <FirstName>Ana-Maria</FirstName> <LastName>Simundic</LastName> <Affiliation>Editor-in-chief, Biochemia Medica, Zagreb, Croatia </Affiliation> </Author> </AuthorList> <ArticleIdList> <ArticleId IdType="doi"> /BM </ArticleId> <ArticleId IdType="pii">biochem </ArticleId> </ArticleIdList> <History> <PubDate PubStatus="epublish"> <Year>2014</Year> <Month>2</Month> <Day>15</Day> </PubDate> </History> </Article> <Article> </Article> <Article> </Article> </ArticleSet> th KCSE Editor s Workshop, Seoul 2015

22 Example - 2 : pubmed.xml, pubmed_list.xsl and pubmed_list.css th KCSE Editor s Workshop, Seoul 2015

23 pubmed_list.xsl <xsl:template match="/"> <html> <head> Add the XSL style sheet reference ( pubmed_list.xml ) <title>article list - PubMed XML</title> <link rel="stylesheet" type="text/css" href="pubmed_list.css"/> </head> pubmed.xml <body> <xsl:apply-templates/> </body> </html> </xsl:template> <xsl:template match="article"> <div class="article"> <div class="articletitle"> <xsl:apply-templates select="articletitle"/> </div> <div class="authorlist"> <xsl:apply-templates select="authorlist"/> </div> <div class="etc"> <xsl:call-template name="etc"/> </div> </div> </xsl:template> th KCSE Editor s Workshop, Seoul 2015

24 pubmed_list.css.article { }.ArticleTitle { }.AuthorList { }.Etc { width:100%; border:1px dotted #000000; padding: 10px 5px 10px 5px; margin-bottom: 5px; Selector Bottom margin 5px font-size: 15pt; font-weight: bold; margin-bottom: 5px; font-family: Times New Roman, Times, Arial, Tahoma, Sans-serif, Verdana; font-size: 12pt; font-style: normal; font-family: Times New Roman, Times, Arial, Tahoma, Sans-serif, Verdana; font-size: 10pt; font-family: Times New Roman, Times, Arial, Tahoma, Sans-serif, Verdana; }.JournalTitle { font-size: 10pt; font-weight: bold; font-style: italic; font-family: Times New Roman, Times, Arial, Tahoma, Sans-serif, Verdana; } top -10px, right-5px, bottom-10px, left-5px The font specify in Times New Roman. But, if there is no Times New Roman exist, use other fonts with the following order; Times, Arial. Journal title has to be shown Bold and font style in italic th KCSE Editor s Workshop, Seoul 2015

25 Thank you. Reference 1. XML Tutorial. W3school website [cited by ]. Available from: 2. XSLT Tutorial. W3school website [cited by ]. Available from: 3. CSS Tutorial. W3school website [cited by ]. Available from: 4. Lee YH. XSL & CSS. In: Huh S editor. The 9th Editor s Workshop; 2013 Jul 4-5; Seoul: KCSE; p Cho YS. How to construct XSL and/or CSS style sheet of XML files based on the data type of definition: Huh S editor. 12th EASE General Assembly and Conference; 2014 June 12-13; Split, Croatia th KCSE Editor s Workshop, Seoul 2015

PowerPoint 프레젠테이션

PowerPoint 프레젠테이션 JATS to PDF 와구성요소 M2community By Younsang Cho Table of Contents 1. 발간프로세스및 JATS to PDF 작업의장단점 2. 구성요소및생성프로세스 3. 국내, 해외출판사 PDF 생성분석 4. Example XML to PDF 2 학술지 PDF 레이아웃에서갖추어야할내용과기능 학술지발간프로세스 Before After