Blocks (blok) XSL-FO

Output XSL-FO berada di area blok.

Halaman, Aliran serta Blok XSL-FO

Kandungan 'blok' akan 'alir' ke 'halaman' dan kemudian dioutput ke media.

Output XSL-FO biasanya terdapat dalam elemen <fo:block>, <fo:block> terdapat dalam elemen <fo:flow>, <fo:flow> terdapat dalam elemen <fo:page-sequence>:

<fo:page-sequence>
  <fo:flow flow-name="xsl-region-body">
    <fo:block>
      <!-- Output goes here -->
    </fo:block>
  </fo:flow>
</fo:page-sequence>

Sifat kawasan blok

Blok adalah susunan output yang terletak di dalam kotak persegi:

<fo:block border-width="1mm">
Terdapat border 1 milimeter di sekeliling output blok ini.
</fo:block>

Sebab kawasan blok adalah kotak persegi, jadi boleh berbagi banyak sifat kawasan umum:

  • ruang sebelum dan ruang selepas
  • margin
  • border
  • padding
  • ruang sebelum

Gambaran:

ruang sebelum dan ruang selepas Adalah kawasan kosong yang membagi blok daripada blok lain.

margin Adalah kawasan kosong di luar blok.

border Adalah persegi panjang di luar sempadan kawasan ini. Empat sisi boleh mempunyai lebar yang berbeza. Ia juga boleh diisi dengan warna dan imej latar belakang yang berbeza.

padding Adalah kawasan yang terletak di antara kawasan kandungan dan border.

KandunganKawasan ini boleh mengandungi kandungan sebenar, seperti teks, imej, grafik dan sebagainya.

margin blok

  • margin
  • margin atas
  • margin bawah
  • margin kiri
  • margin kanan

border blok

Sifat gaya border:

  • gaya border
  • gaya sebelum border
  • gaya setelah border
  • gaya sebelah kiri border
  • gaya sebelah kanan border
  • gaya atas border ((sama seperti border-before)
  • gaya bawah border (sama seperti border-after)
  • gaya border kiri (sama seperti border-start)
  • gaya border kanan (sama seperti border-end)

Sifat warna border:

  • warna border
  • warna sebelum border
  • warna setelah border
  • warna sebelah kiri border
  • warna sebelah kanan border
  • warna atas border (sama seperti border-before)
  • warna bawah border (sama seperti border-after)
  • border-left-color (等同于 border-start)
  • border-right-color (等同于 border-end)

边框宽度属性:

  • border-width
  • border-before-width
  • border-after-width
  • border-start-width
  • border-end-width
  • border-top-width (等同于 border-before)
  • border-bottom-width (等同于 border-after)
  • border-left-width (等同于 border-start)
  • border-right-width (等同于 border-end)

块填充

  • padding
  • padding-before
  • padding-after
  • padding-start
  • padding-end
  • padding-top (等同于 padding-before)
  • padding-bottom (等同于 padding-after)
  • padding-left (等同于 padding-start)
  • padding-right (等同于 padding-end)

块背景

  • background-color
  • background-image
  • background-repeat
  • background-attachment (scroll 或者 fixed)

块样式属性：

块是可被单独样式化的输出序列：

<fo:block
  font-size="12pt"
  font-family="sans-serif">
This block of output will be written in a 12pt sans-serif font.
</fo:block>

字体属性:

  • font-family
  • font-weight
  • font-style
  • font-size
  • font-variant

文本属性:

  • text-align
  • text-align-last
  • text-indent
  • start-indent
  • end-indent
  • wrap-option (定义自动换行，word wrap)
  • break-before (定义分页符，page breaks)
  • break-after (mengdefinikan penanda halaman, patah halaman)
  • reference-orientation (mengdefinikan putar teks dalam 90")

Contoh

<fo:block
    font-size="14pt" font-family="verdana" color="red"
    space-before="5mm" space-after="5mm">
W3School
</fo:block>
<fo:block
    text-indent="5mm"
    font-family="verdana" font-size="12pt"
    space-before="5mm" space-after="5mm">
Di CodeW3C.com, anda akan mendapati semua panduan pembinaan web yang anda
perlu, dari HTML dan XHTML dasar ke XML, XSL, Multimedia tingkat tinggi
dan WAP.
</fo:block>

Hasil:

Lihat contoh di atas, jika hendak menghasilkan dokumen dengan banyak tajuk dan paragraf, maka akan memerlukan banyak kod.

Biasanya, dokumen XSL-FO tidak akan menggabungkan maklumat format dan kandungan seperti yang kita lakukan sebelum ini.

Dengan sedikit bantuan daripada XSLT, kita boleh meletakkan maklumat format ke dalam templat, dan menulis kandungan yang lebih bersih.

Anda akan belajar bagaimana untuk menggunakan templat XSLT untuk menggabungkan XSL-FO di bab belakang panduan ini.