/********************************************************************* Spoken Table stylesheet, written by Mark 'Tarquin' Wilton-Jones Version 1.3 12/11/2004 Opera 7.6+ stylesheet - attempts to make sense out of tables - for use with speech component. This can be used as either a user stylesheet or as an alternate stylesheet for your page: Please keep this comment in the file. See http://www.howtocreate.co.uk/jslibs/termsOfUse.html for terms of use, and see http://www.howtocreate.co.uk/operaStuff/ to download updates to this CSS file. *********************************************************************/ /* keep count of rows and cells */ table { counter-reset: rowcount; } tr { counter-increment: rowcount; counter-reset: cellcount; } td, th { counter-increment: cellcount; } /* describe the position of the table */ table:before { content: "Starting table."; } table[title]:before { content: "Starting table with title "attr(title)"."; } table:after, table[title]:after { content: "Ending table."; } table table:before { content: "Starting nested table."; } table table[title]:before { content: "Starting nested table with title "attr(title)"."; } table table:after, table table[title]:after { content: "Ending nested table."; } /* describe the table */ table[summary]:before { content: "Starting table with the following summary: "attr(summary)" - "attr(title); } table table[summary]:before { content: "Starting nested table with the following summary: "attr(summary)" - "attr(title); } caption:before { content: "Table caption - "; } caption[title]:after { pause-before: 500ms; content: attr(title)". "; } /* say row number */ tr:before { content: "Row "counter(rowcount)". "; } tr[title]:before { content: "Row "counter(rowcount)" with title "attr(title)". "; } tr[title]:after { content: normal; } /* say thead tbody and tfoot */ thead:before { content: "Starting table head. "; } tbody:before { content: "Starting table body. "; } tfoot:before { content: "Starting table foot. "; } thead[title]:before { content: "Starting table head with title "attr(title)". "; } tbody[title]:before { content: "Starting table body with title "attr(title)". "; } tfoot[title]:before { content: "Starting table foot with title "attr(title)". "; } thead[title]:after, tbody[title]:after, tfoot[title]:after { content: normal; } /* describe the scope of the header */ th[title]:after { pause-before: 500ms; content: attr(title)". "; } th[scope]:after { pause-before: 500ms; content: attr(title)" - This header relates to the current "attr(scope)". "; } th[scope="col"]:after { pause-before: 500ms; content: attr(title)" - This header relates to the current column. "; } th[id]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)". "; } th[id][scope]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)" and relates to the current "attr(scope)". "; } th[id][scope="col"]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)" and relates to the current column. "; } /* and the categories */ th[axis]:after { pause-before: 500ms; content: attr(title)" - in the category - "attr(axis)". "; } th[axis][scope]:after { pause-before: 500ms; content: attr(title)" - This header relates to the current "attr(scope)" and is in the category - "attr(axis)". "; } th[axis][scope="col"]:after { pause-before: 500ms; content: attr(title)" - This header relates to the current column and is in the category - "attr(axis)". "; } th[axis][id]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)" and is in the category - "attr(axis)". "; } th[axis][id][scope]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)", relates to the current "attr(scope)" and is in the category - "attr(axis)". "; } th[axis][id][scope="col"]:after { pause-before: 500ms; content: attr(title)" - This header has been identified with the name "attr(id)", relates to the current column and is in the category - "attr(axis)". "; } /* describe the categories of the cell */ td[title]:after { pause-before: 500ms; content: attr(title)". "; } td[axis]:after, td[title][axis]:after { pause-before: 500ms; content: attr(title)" - in the category - "attr(axis)". "; } /* describe the position of the cell */ td:before { content: "Cell "counter(cellcount)". "; } td[rowspan]:before { content: "Cell "counter(cellcount)" spanning "attr(rowspan)" rows. "; } td[colspan]:before { content: "Cell "counter(cellcount)" spanning "attr(colspan)" columns. "; } td[rowspan][colspan]:before { content: "Cell "counter(cellcount)" spanning "attr(rowspan)" rows and "attr(colspan)" columns. "; } td[headers]:before { content: "Cell "counter(cellcount)" under heading "attr(headers)". "; } td[headers][rowspan]:before { content: "Cell "counter(cellcount)" spanning "attr(rowspan)" rows under heading "attr(headers)". "; } td[headers][colspan]:before { content: "Cell "counter(cellcount)" spanning "attr(colspan)" columns under heading "attr(headers)". "; } td[headers][rowspan][colspan]:before { content: "Cell "counter(cellcount)" spanning "attr(rowspan)" rows and "attr(colspan)" columns under heading "attr(headers)". "; } /* describe the position of the header */ th:before { content: "Header "counter(cellcount)". "; } th[rowspan]:before { content: "Heading "counter(cellcount)" spanning "attr(rowspan)" rows. "; } th[colspan]:before { content: "Heading "counter(cellcount)" spanning "attr(colspan)" columns. "; } th[rowspan][colspan]:before { content: "Header "counter(cellcount)" spanning "attr(rowspan)" rows and "attr(colspan)" columns. "; } th[headers]:before { content: "Header "counter(cellcount)" under heading "attr(headers)". "; } th[headers][rowspan]:before { content: "Heading "counter(cellcount)" spanning "attr(rowspan)" rows under heading "attr(headers)". "; } th[headers][colspan]:before { content: "Heading "counter(cellcount)" spanning "attr(colspan)" columns under heading "attr(headers)". "; } th[headers][rowspan][colspan]:before { content: "Header "counter(cellcount)" spanning "attr(rowspan)" rows and "attr(colspan)" columns under heading "attr(headers)". "; } /* try and keep it clean so the reader can read it, but minimising visual change */ table:before, table:after, caption:before, caption:after, thead:before, tbody:before, tfoot:before, tr:before, td:before, td:after, th:before, th:after { display: inline-block; height: 1px; width: 1px; overflow: hidden; voice-family: young female; -xv-voice-pitch: 180; -xv-voice-volume: loud; speak: normal !important; } table { voice-family: young male; -xv-voice-pitch: medium; -xv-voice-volume: medium; }