Showing posts with label web. Show all posts
Showing posts with label web. Show all posts

2009-03-12

Markup and Typography

The blog "A List Apart" has a cool article on using dashes and hyphens in HTML — those nasty –, —, and ­ characters, y’kno?

From the article:

  1. ‘ for an opening single quote (Ctrl + ` ` in Word—that’s two grave accents—that character on the tilde key).
  2. ’ for a closing single quote (or an apostrophe) (Ctrl + '' in Word).
  3. “ for an opening double quote (Ctrl + ` " in Word).
  4. ” for a closing double quote (Ctrl + ' " in Word).

… and …

I’ll bet you didn’t know this about HTML—the <q> and <blockquote> elements are designed to have quote marks automatically inserted in the appropriate locations. No current browser does this by default, however, and even those that do when faced with the appropriate style sheet markup (as detailed in CSS) get it wrong, especially with curly quotes.

See the article for the full story.

2008-05-20

Google API Example Code [Obtained Key]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>My Google Data API Application</title>
    <script src="http://www.google.com/jsapi?key=ABQIAAAAEF0hbwoIdolnKjr5eMdCPRR65_V0rae5Sii3SwQWquZGohjOQRRV-du2YimkeA46q7aGVN6U-luT3w" type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[

    google.load("gdata", "1");

    function OnLoad() {
      // Fill out
    }

    //]]>
    </script>
  </head>
  <body onload="OnLoad()">
    <div id="panel"/>
  </body>
</html>

2007-01-25

CSS syntax highlighter

Checking out the JavaScript drawing program example called Doodle at the webreference.com section on JavaScript Programming, I found this bit of CSS that does syntax highlighting: SyntaxHighlighter.css [http://www.webreference.com/css/SyntaxHighlighter.css]

See also the Doodle Javascript programming example provided by WebReference for use of these style classes. Nice bit of work.

Here is a trivial example of the HTML to use of some of SyntaxHighlighter.css classes [from the example article, page 3]:

<div style="width: 700px;">
<textarea name="code" class="javascript" cols="60" rows="10"> 

<P class=code>&lt;script src="core.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script src="graphics.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script src="canvas.js" 
type=text/javascript&gt;&lt;/script&gt;<BR>&lt;script 
type=text/javascript&gt;<BR>var canvas = null;<BR>function initCanvas() 
{<BR>&nbsp;&nbsp;&nbsp;canvas = new 
Canvas($('theCanvas'));<BR>}<BR>window.setTimeout(initCanvas, 
10);<BR>&lt;/script&gt;<BR>&nbsp;&nbsp;&nbsp;&lt;div id="theFrame" 
class="CanvasFrame"&gt;&lt;/div&gt;<BR>&nbsp;&nbsp;&nbsp;&lt;div id="theCanvas" 
class="Canvas"&gt;&lt;/div&gt;<BR>&lt;/div&gt;</P>

</textarea>
</div>

Other examples occur in the article.

This CSS seems to make a nice complement to the PHP syntax highlighter blogged about elsewhere.