Difference between revisions of "Adding stylesheets for other output devices/zh-tw"

From Joomla! Documentation

(Created page with "為其他裝置新增樣式表(stylesheets)")
 
(Created page with "用這個方式，您可以確保樣式表被加到文件中，也可以讓外掛使用(亦即，用來組合或是壓縮樣式表)")
 
(8 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<noinclude><languages /></noinclude>
 
<noinclude><languages /></noinclude>
−
Using CSS style sheets, it is possible to use a set of directives(styles) depending upon the device being used to browse web pages.
+
要使用 CSS 樣式表，可以 it is possible to use a set of directives(styles) depending upon the device being used to browse web pages.
  
−
===Media Types===
+
===媒體類型===
−
The recognised media types are:
+
可以識別的媒體類型有:
−
*all - Suitable for all devices.
+
*all - 適用於所有裝置
 
*aural - For speech synthesizers.  
 
*aural - For speech synthesizers.  
 
*braille - Intended for braille tactile feedback devices.  
 
*braille - Intended for braille tactile feedback devices.  
−
*embossed - Intended for paged braille printers.  
+
*embossed - 用於 paged braille printers.  
−
*handheld - Intended for handheld devices.
+
*handheld - 用於手持裝置
−
*print - Used for formatting printed pages.
+
*print - 用於組織印表機輸出頁面
−
*projection - Intended for projected presentations, for example projectors or print to transparencies.
+
*projection - 用於 projected presentations。例如投影裝置或是 print to transparencies.
−
*screen - Intended primarily for color computer screens.
+
*screen - 主要用於彩色電腦螢幕
 
*tty - Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.  
 
*tty - Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.  
 
*tv - Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).  
 
*tv - Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).  
  
−
===Examples===
+
===範例===
−
You can assign a media type to a CSS declaration with the following syntax
+
您可以使用底下的語法，指定 CSS declaration媒體類型
  
 
<source lang="css">
 
<source lang="css">
Line 27: Line 27:
 
</source>
 
</source>
  
−
To assign more than one declaration style to more than one media type:
+
要指定多個媒體類型到多個declaration style：
  
 
<source lang="css">
 
<source lang="css">
Line 48: Line 48:
 
</source>
 
</source>
  
−
The recommended way to include a stylesheet is:
+
include 樣式表，推薦的方式是：
 
<source lang="php">
 
<source lang="php">
 
<?php
 
<?php
Line 57: Line 57:
 
</source>
 
</source>
  
−
This way, you ensure the stylesheet will be added to the document and is accessible to plugins (e.g for combining and compressing stylesheets).
+
用這個方式，您可以確保樣式表被加到文件中，也可以讓外掛使用(亦即，用來組合或是壓縮樣式表)
  
 
<noinclude>
 
<noinclude>
−
[[Category:Tutorials]]
+
[[Category:Tutorials/zh-tw]]
−
[[Category:Templates]]
+
[[Category:Templates/zh-tw]]
−
[[Category:CSS]]
+
[[Category:CSS/zh-tw]]
 
</noinclude>
 
</noinclude>

Latest revision as of 21:18, 1 February 2021

Other languages:
অসমীয়া • ‎български • ‎বাংলা • ‎Deutsch • ‎English • ‎español • ‎فارسی • ‎français • ‎हिन्दी • ‎Nederlands • ‎português • ‎português do Brasil • ‎русский • ‎中文（台灣）‎

要使用 CSS 樣式表，可以 it is possible to use a set of directives(styles) depending upon the device being used to browse web pages.

媒體類型

可以識別的媒體類型有:

  • all - 適用於所有裝置
  • aural - For speech synthesizers.
  • braille - Intended for braille tactile feedback devices.
  • embossed - 用於 paged braille printers.
  • handheld - 用於手持裝置
  • print - 用於組織印表機輸出頁面
  • projection - 用於 projected presentations。例如投影裝置或是 print to transparencies.
  • screen - 主要用於彩色電腦螢幕
  • tty - Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.
  • tv - Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).

範例

您可以使用底下的語法，指定 CSS declaration媒體類型

@media print {
  body { 
    font-size: 12pt;
    font-color: #000000; 
  }
}

要指定多個媒體類型到多個declaration style：

@media print, handheld{
  body { 
    font-size: 12pt;
    font-color: #000000;
  }
  img {
    max-width: 100%;
    height: auto;
  }
}

The directives can be used in the main CSS file or in a separate style sheet for a given media type. There must be an include to the CSS file in the templates <head> section (the following is taken from the Joomla! Beez template):

<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/beez/css/print.css" type="text/css" media="Print" />

include 樣式表，推薦的方式是：

<?php
$document = JFactory::getDocument();
 $tpath = $this->baseurl . '/templates/' . $this->template;
$document->addStyleSheet( $tpath . '/css/print.css', 'text/css', 'print'); // arguments: $path, $type, $media
?>

用這個方式，您可以確保樣式表被加到文件中，也可以讓外掛使用(亦即，用來組合或是壓縮樣式表)

Retrieved from "https://docs.joomla.org/index.php?title=Adding_stylesheets_for_other_output_devices/zh-tw&oldid=781504"