|
|
 | Centregring af baggrundsbillede
Fra : Kurt Hansen |
Dato : 25-02-11 15:38 |
|
Kan man centrere et baggrundsbillede, således at det altid - uanset
størrelse - holder overkant og at billedets lodrette centrum altid er
vandret centreret på siden?
--
Venlig hilsen Kurt Hansen
Ægte mod er at kalde en spade for en spade,
også når man taler med spaden selv ...
| |
 Anonymous (25-02-2011)
| Kommentar
Fra : Anonymous |
Dato : 25-02-11 16:14 |
|
Den 25-02-2011 15:38, Kurt Hansen skrev:
> Kan man centrere et baggrundsbillede, således at det altid - uanset
> størrelse - holder overkant og at billedets lodrette centrum altid er
> vandret centreret på siden?
Den lange form er
background-image: URL(URL) x-pos y-pos
så altså
background-image: url(ditbillede.jpg) center 0;
MVH
Rune Jensen
| |
Jørgen Farum Jensen (25-02-2011)
| Kommentar
Fra : Jørgen Farum Jensen |
Dato : 25-02-11 17:15 |
|
Den 25-02-2011 16:13, Anonymous skrev:
> Den 25-02-2011 15:38, Kurt Hansen skrev:
>> Kan man centrere et baggrundsbillede, således at det altid
>> - uanset
>> størrelse - holder overkant og at billedets lodrette
>> centrum altid er
>> vandret centreret på siden?
>
> Den lange form er
>
> background-image: URL(URL) x-pos y-pos
>
> så altså
>
> background-image: url(ditbillede.jpg) center 0;
+ background-repeat:no-repeat.
--
Jørgen Farum Jensen
http://webdesign101.dk
..
| |
 Kurt Hansen (25-02-2011)
| Kommentar
Fra : Kurt Hansen |
Dato : 25-02-11 17:55 |
|
Fri, 25 Feb 2011 17:14:58 +0100 skrev Jørgen Farum Jensen:
>Den 25-02-2011 16:13, Anonymous skrev:
>> Den 25-02-2011 15:38, Kurt Hansen skrev:
>>> Kan man centrere et baggrundsbillede, således at det altid
>>> - uanset
>>> størrelse - holder overkant og at billedets lodrette
>>> centrum altid er
>>> vandret centreret på siden?
>>
>> Den lange form er
>>
>> background-image: URL(URL) x-pos y-pos
>>
>> så altså
>>
>> background-image: url(ditbillede.jpg) center 0;
>
>+ background-repeat:no-repeat.
Yep, tak for det.
Nu er det jo ofte sådan, at eet spørgsmål afføder det næste. Hvis jeg
nu ikke, som det vel er default, vil have den til at holde overkant,
men underkant i browservinduet? Så bliver det vel lidt mere
besværligt?
--
Venlig hilsen Kurt Hansen
Ægte mod er at kalde en spade for en spade,
også når man taler med spaden selv ...
| |
scootergrisen (25-02-2011)
| Kommentar
Fra : scootergrisen |
Dato : 25-02-11 18:07 |
|
> Nu er det jo ofte sådan, at eet spørgsmål afføder det næste. Hvis jeg
> nu ikke, som det vel er default, vil have den til at holde overkant,
> men underkant i browservinduet? Så bliver det vel lidt mere
> besværligt?
Så det vist bare :
background:#ffffff url(ditbillede.jpg) no-repeat center bottom;
| |
Kurt Hansen (26-02-2011)
| Kommentar
Fra : Kurt Hansen |
Dato : 26-02-11 06:15 |
|
Fri, 25 Feb 2011 17:14:58 +0100 skrev Jørgen Farum Jensen:
>Den 25-02-2011 16:13, Anonymous skrev:
>> Den 25-02-2011 15:38, Kurt Hansen skrev:
>>> Kan man centrere et baggrundsbillede, således at det altid
>>> - uanset
>>> størrelse - holder overkant og at billedets lodrette
>>> centrum altid er
>>> vandret centreret på siden?
>>
>> Den lange form er
>>
>> background-image: URL(URL) x-pos y-pos
>>
>> så altså
>>
>> background-image: url(ditbillede.jpg) center 0;
>
>+ background-repeat:no-repeat.
Njet. Så snart jeg sætter noget bagefter, bliver der bare vist en hvid
baggrund.
background-image:url("murillo.gif");
viser billedet i øverste, venstre hjørne
background-image:url("murillo.gif") center 0;
giver bare hvid baggrund
http://www.danacord.dk/test.html
Øvelsen går stadig ud på at få baggrundsbilledet centreret lodret.
P.S. Skal der anførselstegn omkring filnavnet? Så vidt jeg kan se, gør
det ingen forskel, men hvad er korrekt?
--
Venlig hilsen Kurt Hansen
Ægte mod er at kalde en spade for en spade,
også når man taler med spaden selv ...
| |
Jørgen Farum Jensen (26-02-2011)
| Kommentar
Fra : Jørgen Farum Jensen |
Dato : 26-02-11 11:36 |
|
Den 26-02-2011 06:15, Kurt Hansen skrev:
> Njet. Så snart jeg sætter noget bagefter, bliver der bare vist en hvid
> baggrund.
>
> background-image:url("murillo.gif");
> viser billedet i øverste, venstre hjørne
>
> background-image:url("murillo.gif") center 0;
> giver bare hvid baggrund
Du blander en egenskab med kortformsværdier
Alle værdier
background-color: #rrggbb;
background-image: url([sti]baggrund.png);
background-repeat:repeat;
background-attachment:scroll;
background-position: x y;
Kortformsudgaven
background: #rrggbb url([sti]baggrund.png) no-repeat scroll y x;
Der er noget med at man kan fjerne værdier, der
er standard (default), men jeg husker ikke reglerne.
--
Jørgen Farum Jensen
http://webdesign101.dk
..
| |
Jørgen Farum Jensen (26-02-2011)
| Kommentar
Fra : Jørgen Farum Jensen |
Dato : 26-02-11 12:35 |
|
Den 26-02-2011 11:35, Jørgen Farum Jensen skrev:
> Du blander en egenskab med kortformsværdier
>
> Alle værdier
> background-color: #rrggbb;
> background-image: url([sti]baggrund.png);
> background-repeat:repeat;
> background-attachment:scroll;
> background-position: x y;
>
> Kortformsudgaven
>
> background: #rrggbb url([sti]baggrund.png) no-repeat scroll
> y x;
>
> Der er noget med at man kan fjerne værdier, der
> er standard (default), men jeg husker ikke reglerne.
>
PS: Jeg glemte at referere til den artikel
jeg har skrevet om emnet:
http://webdesign101.dk/www/background/
--
Jørgen Farum Jensen
http://webdesign101.dk
..
| |
Kurt Hansen (26-02-2011)
| Kommentar
Fra : Kurt Hansen |
Dato : 26-02-11 15:49 |
|
Sat, 26 Feb 2011 11:35:57 +0100 skrev Jørgen Farum Jensen:
>Den 26-02-2011 06:15, Kurt Hansen skrev:
>
>> Njet. Så snart jeg sætter noget bagefter, bliver der bare vist en hvid
>> baggrund.
>>
>> background-image:url("murillo.gif");
>> viser billedet i øverste, venstre hjørne
>>
>> background-image:url("murillo.gif") center 0;
>> giver bare hvid baggrund
>
>Du blander en egenskab med kortformsværdier
>
>Alle værdier
> background-color: #rrggbb;
> background-image: url([sti]baggrund.png);
> background-repeat:repeat;
> background-attachment:scroll;
> background-position: x y;
>
>Kortformsudgaven
>
>background: #rrggbb url([sti]baggrund.png) no-repeat scroll y x;
Tak, det klarede begreberne.
Min øvelse gik ud på at lave en work-around til det problem jeg bragte
til torvs i tråden "To halve backgrounds"
Message-ID: <e36tk6hu0vt6p5k4gmhlk3orjrscqdtcs0@4ax.com>
Min fedtmuleløsning kan ses her: http://www.danacord.dk/test.html
Der er ikke tilstræbt godt design og harmoni i farver og grafisk
udtryk. Webshoppen er ikke en rigtig webshop, men et image og det hele
er smidt på en skovl.
Det er kun taget højde for opløsninger op til 1280*1024, men det er
kun et spørgsmål om at udvide baggrundsbilledet.
Jeg konstaterer, at det scalerer som ønsket nedad.
Jeg ved ikke hvor smart det er, når det kommer til stykket. Er det
brugbart, eller hvad kan ændres?
--
Venlig hilsen Kurt Hansen
Ægte mod er at kalde en spade for en spade,
også når man taler med spaden selv ...
| |
Anonymous (26-02-2011)
| Kommentar
Fra : Anonymous |
Dato : 26-02-11 16:08 |
|
Den 26-02-2011 15:48, Kurt Hansen skrev:
> Jeg ved ikke hvor smart det er, når det kommer til stykket. Er det
> brugbart, eller hvad kan ændres?
Det er sguda flot :)
Men jeg ville måske også være lidt opmærksom på, at baggrund ikke
overdøver forgrund.
Billedet i højre side stopper lidt brat, og måske er det heller ikke
lige i harmoni med det andet.
Man kunne fade det ud i en farve længere nede. Det ville løse problemet
med, billedet ikke er længere. Godt nok lidt svært i et sort hvid
billede, det ved jeg.
PS.: Da dette egentlig er kritik af et design, sætter jeg FUT til
Ris+Ros. Dvs. at svar herpå bringe i den gruppe.
MVH
Rune Jensen
| |
Kurt Hansen (26-02-2011)
| Kommentar
Fra : Kurt Hansen |
Dato : 26-02-11 17:16 |
|
Sat, 26 Feb 2011 16:08:04 +0100 skrev Anonymous:
>Den 26-02-2011 15:48, Kurt Hansen skrev:
>
>> Jeg ved ikke hvor smart det er, når det kommer til stykket. Er det
>> brugbart, eller hvad kan ændres?
>
>Det er sguda flot :)
Spinde-spinde 
>Men jeg ville måske også være lidt opmærksom på, at baggrund ikke
>overdøver forgrund.
Hvis jeg lige må citere mig selv:
>>Der er ikke tilstræbt godt design og harmoni i farver og grafisk
>>udtryk. Webshoppen er ikke en rigtig webshop, men et image og det
>>hele er smidt på en skovl.
>Billedet i højre side stopper lidt brat, og måske er det heller ikke
>lige i harmoni med det andet.
>
>Man kunne fade det ud i en farve længere nede. Det ville løse problemet
>med, billedet ikke er længere. Godt nok lidt svært i et sort hvid
>billede, det ved jeg.
Hvis du betragter baggrundsbilledet solo, vil du se, at der ikke er
kælet for noget. Et kludetæppe i tilfældig (alt for stor) størrelse.
Jeg skulle bare se om det virkede.
>PS.: Da dette egentlig er kritik af et design, sætter jeg FUT til
>Ris+Ros. Dvs. at svar herpå bringe i den gruppe.
Overruled, da jeg netop har pointeret, at det ikke er designet der
skal vurderes. Det er teknikken og anvendeligheden.
--
Venlig hilsen Kurt Hansen
Ægte mod er at kalde en spade for en spade,
også når man taler med spaden selv ...
| |
Anonymous (26-02-2011)
| Kommentar
Fra : Anonymous |
Dato : 26-02-11 17:38 |
|
Den 26-02-2011 17:15, Kurt Hansen skrev:
>> PS.: Da dette egentlig er kritik af et design, sætter jeg FUT til
>> Ris+Ros. Dvs. at svar herpå bringe i den gruppe.
>
> Overruled, da jeg netop har pointeret, at det ikke er designet der
> skal vurderes. Det er teknikken og anvendeligheden.
OK, jeg var selv i tvivl, men fandt at ris+ros var egnet, da jeg ikke
gav noget svar på selve teknikken.
Derfor kan (bør) diskussionen om teknikken jo godt køre videre her.
MVH
Rune Jensen
| |
|
|