Olet tällä hetkellä offline-tilassa. Internet-yhteyden muodostamista uudelleen odotetaan

Mukautettujen hyperlinkkien luominen CSS-tyylisivujen avulla FrontPage 2003:ssa

Office 2003:n tuki on päättynyt

Microsoft lopetti Office 2003:n tuen 8.4.2014. Tämä muutos on vaikuttanut ohjelmistopäivityksiin ja suojausasetuksiin. Lue lisätietoja muutoksen vaikutuksesta ja suojauksen varmistamisesta.

Tämän artikkelin Microsoft FrontPage 2002 -sovellusta käsittelevä versio on 287706.
Yhteenveto
Tässä artikkelissa kuvataan, miten Microsoft Office FrontPage 2003:ssa luodaan mukautettuja hyperlinkkejä CSS (Cascading Style Sheet) -tyylisivujen avulla. Artikkelissa on esimerkkejä, jotka esittelevät mukautettujen hyperlinkkien luomisen CSS-tyylisivuominaisuuksian avulla.

Huomautus Tässä artikkelissa käytetään CSS-tyylisivuominaisuuksia, joita kaikki Web-selaimet eivät välttämättä tue. Lisätietoja on FrontPagen ohjeessa. Voit tehdä tämän valitsemalla Ohje-valikosta Microsoft FrontPage Ohje, kirjoittamalla Haku-riville CSS-tyylisivujen yhteensopivuus ja painamalla sitten ENTER-näppäintä, jolloin näyttöön tulee tietoja aiheesta.

Palaa alkuun

Mukautettujen hyperlinkkien luominen CSS-tyylisivujen avulla

Seuraava esimerkki esittelee, miten mukautetut hyperlinkin luodaan CSS-tyylisivuominaisuuksien avulla:

Microsoftin tarjoamat ohjelmointiesimerkit ovat vain ohjeellisia, eikä niihin liity mitään nimenomaisesti ilmaistua tai oletettua takuuta, mukaan lukien oletettu takuu tuotteen soveltuvuudesta kaupankäynnin kohteeksi tai sopivuudesta johonkin tiettyyn tarkoitukseen. Tässä artikkelissa oletetaan, että olet perehtynyt käytettyyn ohjelmointikieleen sekä työkaluihin, joita käytetään prosessien luomisessa sekä virheiden jäljittämisessä ja korjaamisessa. Microsoftin tukipalvelun asiantuntijat voivat auttaa tietyn toiminnon toteuttamisessa, mutta he eivät muokkaa näitä esimerkkejä niiden kuvaamien toimintojen parantamiseksi eivätkä esitä ratkaisuja erityistarpeita varten. Huomautus Näyttöön saattaa tulla virhesanoma tai sivua ei välttämättä näytetä oikein, jos kopiot esimerkit suoraan tästä artikkelista ja liität ne FrontPageen. Kulmasulkeet (< ja >) saattavat näkyä HTML-koodina. Voit kiertää tämän ongelman liittämällä koodinäytteen ensin tyhjään asiakirjaan Muistiossa ja kopioimalla sen sitten siitä sivuusi FrontPagessa.

Palaa alkuun

Esimerkki 1: Sellaisten hyperlinkkien luominen, jossa vain alleviivaus näkyy erivärisenä

Tämä esimerkki muotoilee hyperlinkin tekstin käyttämään samaa väriä kuin asiakirjan teksti. Vain hyperlinkin alleviivaus näkyy erivärisenä. Voit luoda mukautetun hyperlinkin seuraavasti:
  1. Käynnistä FrontPage ja luo uusi, tyhjä sivu.
  2. Valitse Näytä-valikosta Sivu ja valitse sitten sivun alaosassa Koodi.
  3. Lisää seuraava koodi sivun <head></head>-alueeseen:
    <style>body      { color: black; background-color: white; font-family: arial }a         { color: black; text-decoration: none; border-bottom-style: solid; border-bottom-width: 1px }a:link    { border-bottom-color: blue }a:visited { border-bottom-color: purple }a:hover   { border-bottom-color: green }a:active  { border-bottom-color: red }</style>
  4. Lisää seuraava koodi sivun <body></body>-alueeseen:
    <p>Lue lisätietoja osoitteesta <a href="http://www.microsoft.com">http://www.microsoft.com</a>.</p><p>Lue lisätietoja osoitteesta <a href="http://www.msn.com">http://www.msn.com</a>.</p>
  5. Valitse Tiedosto-valikosta Tallenna.
  6. Määritä Tallenna nimellä -valintaikkunassa tiedoston tallentamisen sijainti, kirjoita Tiedostonimi-ruutuun Esimerkki1 ja valitse sitten Tallenna.
  7. Valitse Tiedosto-valikosta Esikatselu selaimessa ja valitse sitten Web-selain, jota haluat käyttää sivun esikatseluun.
Palaa alkuun

Esimerkki 2: Valintapainikkeita käyttävien hyperlinkkien luominen

Tämä esimerkki luo kiinteätaustaisia valintapainikkeita käyttäviä hyperlinkkejä. Voit luoda mukautetun hyperlinkin seuraavasti:
  1. Käynnistä FrontPage ja luo uusi, tyhjä sivu.
  2. Valitse Näytä-valikosta Sivu ja valitse sitten sivun alaosassa Koodi.
  3. Lisää seuraava koodi sivun <head></head>-alueeseen:
    <style>body      { color: black; background-color: white; font-family: arial }a         { text-decoration: none; padding: 3px }a:link    { color: white; background-color: blue }a:visited { color: white; background-color: purple }a:hover   { color: white; background-color: green }a:active  { color: white; background-color: red }</style>
  4. Lisää seuraava koodi sivun <body></body>-alueeseen:
    <p>Lue lisätietoja osoitteesta <a href="http://www.microsoft.com">http://www.microsoft.com</a>.</p><p>Lue lisätietoja osoitteesta <a href="http://www.msn.com">http://www.msn.com</a>.</p>
  5. Valitse Tiedosto-valikosta Tallenna.
  6. Määritä Tallenna nimellä -valintaikkunassa tiedoston tallentamisen sijainti, kirjoita Tiedostonimi-ruutuun Esimerkki2 ja valitse sitten Tallenna.
  7. Valitse Tiedosto-valikosta Esikatselu selaimessa ja valitse sitten Web-selain, jota haluat käyttää sivun esikatseluun.
Palaa alkuun

Esimerkki 3: Ääriviivatehostepainikkeita käyttävien hyperlinkkien luominen

Tämä esimerkki luo hyperlinkkejä, joissa on ääriviivatehostetta käyttävä valintapainike. Hyperlinkin tekstin ympärille tulee värillinen laatikko, joka luo ääriviivatehosteen. Voit luoda mukautetun hyperlinkin seuraavasti:
  1. Käynnistä FrontPage ja luo uusi, tyhjä sivu.
  2. Valitse Näytä-valikosta Sivu ja valitse sitten sivun alaosassa Koodi.
  3. Lisää seuraava koodi sivun <head></head>-alueeseen:
    <style>body      { color: black; background-color: white; font-family: arial }a         { color: black; text-decoration: none; border-style: solid; border-width: 2px; padding: 2px }a:link    { border-color: blue }a:visited { border-color: purple }a:hover   { border-color: green }a:active  { border-color: red }</style>
  4. Lisää seuraava koodi sivun <body></body>-alueeseen:
    <p>Lue lisätietoja osoitteesta <a href="http://www.microsoft.com">http://www.microsoft.com</a>.</p><p>Lue lisätietoja osoitteesta <a href="http://www.msn.com">http://www.msn.com</a>.</p>
  5. Valitse Tiedosto-valikosta Tallenna.
  6. Määritä Tallenna nimellä -valintaikkunassa tiedoston tallentamisen sijainti, kirjoita Tiedostonimi-ruutuun Esimerkki3 ja valitse sitten Tallenna.
  7. Valitse Tiedosto-valikosta Esikatselu selaimessa ja valitse sitten Web-selain, jota haluat käyttää sivun esikatseluun.
Palaa alkuun

Esimerkki 4: Eri tekstimuotoilua käyttävien hyperlinkkien luominen

Tämä esimerkki muotoilee hyperlinkit käyttämään alleviivaamatonta kursivoitua tekstiä, jossa käytetään pieniä kirjaimia. Kun siirrät hiiren osoittimen hyperlinkin päälle, hyperlinkin teksti muunnetaan isoiksi kirjaimiksi. Voit luoda mukautetun hyperlinkin seuraavasti:
  1. Käynnistä FrontPage ja luo uusi, tyhjä sivu.
  2. Valitse Näytä-valikosta Sivu ja valitse sitten sivun alaosassa Koodi.
  3. Lisää seuraava koodi sivun <head></head>-alueeseen:
    <style>body      { color: black; background-color: white; font-family: arial }a         { text-decoration: none; font-style: italic; text-transform: lowercase }a:link    { color: blue; font-weight: bold }a:visited { color: purple }a:hover   { color: green; text-transform: uppercase }a:active  { color: red  }</style>
  4. Lisää seuraava koodi sivun <body></body>-alueeseen:
    <p>Lue lisätietoja osoitteesta <a href="http://www.microsoft.com">http://WWW.microsoft.COM</a>.</p><p>Lue lisätietoja osoitteesta <a href="http://www.msn.com">http://WWW.msn.COM</a>.</p>
  5. Valitse Tiedosto-valikosta Tallenna.
  6. Määritä Tallenna nimellä -valintaikkunassa tiedoston tallentamisen sijainti, kirjoita Tiedostonimi-ruutuun Esimerkki4 ja valitse sitten Tallenna.
  7. Valitse Tiedosto-valikosta Esikatselu selaimessa ja valitse sitten Web-selain, jota haluat käyttää sivun esikatseluun.
Palaa alkuun
Suositukset
FrontPagen ohjeessa on lisätietoja CSS-tyylisivujen käyttämisestä FrontPage 2003:ssa. Voit tarkastella ohjetta valitsemalla Ohje-valikosta Microsoft FrontPagen Ohje. Kirjoita Etsi-ruutuun CSS-tyylisivut ja paina sitten ENTER-näppäintä, jolloin näyttöön tulee tietoja aiheesta.

Palaa alkuun
Suositukset
Saat lisätietoja napsauttamalla seuraavia artikkeleiden numeroita, jolloin pääset lukemaan artikkelit Microsoft Knowledge Base -tietokannassa:
196488 FP2000: CSS-tyylisivujen kuvaus (tämä artikkeli saattaa olla englanninkielinen)
205996 CSS-tyylisivujen luominen FrontPage 2000:ssa (tämä artikkeli saattaa olla englanninkielinen)
240972 Hyperlinkkien alleviivausten poistaminen FrontPage 2000:ssa (tämä artikkeli saattaa olla englanninkielinen)
222949 FP2000: Lomakepainikkeiden valintatehosteiden luominen DHTML- ja CSS-koodin avulla (tämä artikkeli saattaa olla englanninkielinen)
fp2003
Ominaisuudet

Artikkelin tunnus: 825450 – Viimeisin tarkistus: 01/05/2006 16:10:00 – Versio: 2.1

Microsoft Office FrontPage 2003

  • kbhowto KB825450
Palaute
ng-binding" id="language-">
mp;t=">.gif?DI=4050&did=1&t=">&did=1&t=">('head')[0].appendChild(m);" src="http://c1.microsoft.com/c.gif?">