Hvordan Inkluder eksterne bilder fra en ekstern plassering med CSS

Med Cascading Style Sheets (CSS), kan du ta et bilde fra utsiden ditt webområde på en av sidene. De tre måter å gi et element attributter i CSS er inline stiler, interne stilark og eksterne stilark. Følg disse trinnene for å inkludere eksterne bilder fra en ekstern plassering med CSS.

Bruksanvisning

In-line Styles

1 Finn koden for elementet du ønsker å plassere et bilde i. I dette tilfellet er det

.

2 Sett inn følgende kode mellom slutten av åpningen tag av elementet og den avsluttende hakeparentes:

style = "background-image: url (image_url); width: X px, høyde: Y px;"

Hvor image_url er nettadressen til den eksterne bildet, X er bredden på bildet i piksler, og Y er høyden. Så, i vårt eksempel, ville våre div bli:

<div style = &quot;url(http://www.fake.com/images/fake.gif); width: 30px; height: 30px;&quot;></div>

Intern Style Sheet

3 Finn tag i koden på websiden. Det bør være mot toppen av koden.

4 Flytt tagge ned en linje. Dersom tag ligger på en linje med annen kode, flytte den til en egen linje, og deretter flytte den ned én mer.

5 Sett inn følgende kode på linjen over stikkord:

6 Sett inn følgende kode mellom slutten av åpningen tag av elementet og den avsluttende hakeparentes:

class = "bri"

Så, i vårt eksempel, ville våre div bli

<div class = &quot;bri&quot;></div>

Hint

  • Bruk interne stilark til å fylle en rekke elementer med samme bilde. I dette tilfellet ville du gi class = "bri" attributt til hvert element du ville fylt. På denne måten kan du legge til andre CSS koder til "BRI" class elementer uten å endre på hvert element, bare på toppen av dokumentet.
  • Du kan bruke eksterne stilark ved å sette inn koden fra innsiden interne ark (det vil si kodene ) I et eget dokument. Så, i stedet for å sette dem tags før tag, sette: Du kan sette dette hvor FILENAME.css er filnavnet til den nye ark fil. Dette gjør at du kan bruke samme ark for en rekke sider, noe som er flott hvis du ønsker å bruke de samme stilene i alle sidene dine.
  • Når du viser et eksternt bilde på siden din, vil seerne være å laste den ned fra den eksterne plasseringen. Dette vil spise opp båndbredden som ekstern plassering. Andre Webmasters kan ikke ta vennlig til dette; de kan kutte deg ut fra blant annet bilder fra deres domene, eller de kan klage til webhotellet om misbruk av sine bilder. Innhente tillatelse først.