Coloring links: Difference between revisions
Jump to navigation
Jump to search
| [checked revision] | [checked revision] |
BerkmanSysop (talk | contribs) (symplified with new version) |
BerkmanSysop (talk | contribs) (updated examples) |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 13: | Line 13: | ||
<a href="http://cyber.law.harvard.edu/"><span style="color:green;">Berkman</span></a> | <a href="http://cyber.law.harvard.edu/"><span style="color:green;">Berkman</span></a> | ||
Notice that there are two elements both in front and behind the colored link. | |||
<pre><nowiki> | |||
<span style="color:green;"> | |||
</nowiki></pre> | |||
and | |||
<pre><nowiki> | |||
</span> | |||
</nowiki></pre> | |||
These HTML elements that wrap the section to which color needs to be applied. Both parts are necessary as the rendered HTML must be able to tell the browser where the span, and with that the coloring, starts and ends. | |||
==caveats== | ==caveats== | ||
| Line 19: | Line 32: | ||
==examples== | ==examples== | ||
<pre><nowiki> | <pre><nowiki> | ||
[http://www.google.com/ This | [http://www.google.com/ <span style="color:red;">This</span>] is a link in red. | ||
</nowiki></pre> | </nowiki></pre> | ||
* [http://www.google.com/ <span style="color:red;">This</span>] is a link in red. | * [http://www.google.com/ <span style="color:red;">This</span>] is a link in red. | ||
<pre><nowiki> | <pre><nowiki> | ||
[http://www.google.com/ This | [http://www.google.com/ <span style="color:green;">This</span>] is a link in green. | ||
</nowiki></pre> | </nowiki></pre> | ||
* [http://www.google.com/ <span style="color:green;">This</span>] is a link in green. | * [http://www.google.com/ <span style="color:green;">This</span>] is a link in green. | ||
<pre><nowiki> | <pre><nowiki> | ||
[http://www.google.com/ This | [http://www.google.com/ <span style="color:blue;">This</span>] is a link in blue. | ||
</nowiki></pre> | </nowiki></pre> | ||
* [http://www.google.com/ <span style="color:blue;">This</span>] is a link in blue. | * [http://www.google.com/ <span style="color:blue;">This</span>] is a link in blue. | ||
<pre><nowiki> | <pre><nowiki> | ||
[http://www.google.com/ This | [http://www.google.com/ <span style="color:yellow;">This</span>] is a link in yellow. | ||
</nowiki></pre> | </nowiki></pre> | ||
* [http://www.google.com/ <span style="color:yellow;">This</span>] is a link in yellow. | * [http://www.google.com/ <span style="color:yellow;">This</span>] is a link in yellow. | ||
| Line 37: | Line 50: | ||
<pre><nowiki> | <pre><nowiki> | ||
[http://cyber.law.harvard.edu/cfl/Main_Page This | [http://cyber.law.harvard.edu/cfl/Main_Page <span style="color:green;">This</span>] is a green link. | ||
</nowiki></pre> | </nowiki></pre> | ||
* [http://cyber.law.harvard.edu/cfl/Main_Page <span style="color:green;">This</span>] is a green link. | * [http://cyber.law.harvard.edu/cfl/Main_Page <span style="color:green;">This</span>] is a green link. | ||
Latest revision as of 23:18, 26 January 2013
This wiki supports css style attributes on links.
The syntax is a little unorthodox but is set using the following:
style attribute
To set the style attribute on a link, enclose the link title within a span with a defined style - in this case specifically, color. e.g.:
[http://cyber.law.harvard.edu/ <span style="color:green;">Berkman</span>]
The above would be converted to the following link:
<a href="http://cyber.law.harvard.edu/">Berkman</a>
Notice that there are two elements both in front and behind the colored link.
<span style="color:green;">
and
</span>
These HTML elements that wrap the section to which color needs to be applied. Both parts are necessary as the rendered HTML must be able to tell the browser where the span, and with that the coloring, starts and ends.
caveats
There are no caveats at the moment.
examples
[http://www.google.com/ <span style="color:red;">This</span>] is a link in red.
- This is a link in red.
[http://www.google.com/ <span style="color:green;">This</span>] is a link in green.
- This is a link in green.
[http://www.google.com/ <span style="color:blue;">This</span>] is a link in blue.
- This is a link in blue.
[http://www.google.com/ <span style="color:yellow;">This</span>] is a link in yellow.
- This is a link in yellow.
[http://cyber.law.harvard.edu/cfl/Main_Page <span style="color:green;">This</span>] is a green link.
- This is a green link.