Jag skulle behöva lite tips på hur man gör rundade hörn i en Frame. Utgår från att man på något sätt tillverkar ett hörn i PS eller liknande. Problemen uppstår när jag skall montera dessa. Finns det några "smarta trix" för att placera hörnen i framen, så att dom ligger kvar synliga även vid scrolling? Hur bör man ställa in marginaler och sådant för att få bilden ända ut i kanten?
Rundade hörn i en frame
48 svar · 1 012 visningar · startad av joel_sundkvist
Detta exempel sätter hörnen uppe till höger och uppe till vänster:
[RED]<html>
<head>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
background: #fff url(bg_överst_vänster.gif) no-repeat top left;
}
#pageContent {
width: 100%;
height: 100%;
background: url(bg_överst_höger.gif) no-repeat top right;
}
-->
</style>
</head>
<body>
<div id="pageContent">
Innehåll på sidan..
</div>
</body>
</html>
SÅ här löste jag det med enbart html till https://www.envikenrecords.com & deras produktvisning:
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="../black_stripes.jpg">
<table width="95%" height="95%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td background="../curve_top_left.jpg" width="21" height="21"> </td>
<td background="../edge_top.jpg"> </td>
<td background="../curve_top_right.jpg" width="21" height="21"> </td>
</tr>
<tr>
<td background="../edge_left.jpg"> </td>
<td bgcolor="#FFF8C4">
<table width="95%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td background="../curve_top_left2.jpg" width="21" height="21"> </td>
<td background="../edge_top.jpg"> </td>
<td background="../curve_top_right2.jpg" width="21" height="21"> </td>
</tr>
<tr>
<td background="../edge_left.jpg"> </td>
<td bgcolor="#FFF8C4">
\<table border="0" width="100%" cellspacing="5" cellpadding="0" bgcolor="#FFF8C4"\>
\<tr\>
\<td width="50%" align="left"\> \<font face="Verdana" Size="5" color="#000000"\>\<b\>Slaptones\</b\>\</font\>
\</td\>
<td align="left" valign="top" rowspan="4"><img src="news/slaptones.gif">
</td>
</tr>
<tr>
<td width="50%" align="left"> <font face="Verdana" size="3" color="#0000000"><b><u>Simplify -CD</u></b></font>
</td>
</tr>
<tr>
<td width="40%" align="left"><font face="Verdana" color="#000000" size="2"> För första gången på länge så har ett av Sveriges största skivbolag signat ett rockabilly band. Detta är resultatet. <br>Tre unga brudar spelar rockabilly på deras eget sätt utan att kopiera någon direkt stil. Är egentligen en blandning av rockabilly, country, rock, blues...roots music! <br><br>Please Dont Touch, Tobacco Road, Love Comes Easy, My Man, Night Time, To Remind You, Parchman Farm, My Baby Left Me, Rollin And Tumblin, Cut Across Shorty, Cant Let Go, Little Red Rooster, Are You Tired Of Me Darling</font>
</td>
</tr>
<tr>
<td width="100%">
<font face="Verdana" color="#000000" size="2"><br><font face="Arial" size="2" color="#0000000"><b>Capitol</b></font>
<br>724358120226</font>
</td>
</tr>
<tr>
<td width="20%" align="left">
<font face="Verdana" Size="2" color="#000000">Price: <b>145,00 </b>SEK</font>
</td>
<td width="60%" ALIGN="center">
<FORM ACTION="add.asp" METHOD=POST OnSubmit="alert(' This item has been added to your basket! \n\n You can always change or undo this later!');">
<input type="hidden" name="ProdId" value="2601">
<input type="hidden" name="Titel" value="Simplify -CD">
<font face="Verdana" Size="2" color="#000000"><b>Antal:</b> </font>
<input type="text" name="Antal" size="2" value="1">
<br>
<input id="submit1" src="images/buy.jpg" name="I1" alt="Lägg i din korg" border="0" type="image" OnClick="this.blur()"; align="right">
</form>
</td>
</tr>
</table>
<a href="javascript:history.back(1)"><img src="images/back.jpg" border="0" ALT="Back one step!"></a>
</td>
<td background="../edge_right.jpg"> </td>
</tr>
<tr>
<td background="../curve_bottom_left2.jpg" width="21" height="21"> </td>
<td background="../edge_bottom.jpg"> </td>
<td background="../curve_bottom_right2.jpg" width="21" height="21"> </td>
</tr>
</table>
</td>
<td background="../edge_right.jpg"> </td>
</tr>
<tr>
<td background="../curve_bottom_left.jpg" width="21" height="21"> </td>
<td background="../edge_bottom.jpg"> </td>
<td background="../curve_bottom_right.jpg" width="21" height="21"> </td>
</tr>
</table>
</body>
Våga vägra JavaScript! ;)
För att placera en bild i alla fyra hörnen kan du göra så här:
[RED]<html>
<head>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
background: #fff url(bg_överst_vänster.gif) no-repeat top left;
}
#topRight {
width: 100%;
height: 100%;
background: url(bg_överst_höger.gif) no-repeat top right;
}
#bottomRight {
width: 100%;
height: 100%;
background: url(bg_nederst_höger.gif) no-repeat bottom right;
}
#bottomLeft {
width: 100%;
height: 100%;
background: url(bg_nederst_vänster.gif) no-repeat bottom left;
}
-->
</style>
</head>
<body>
<div id="topRight">
<div id="bottomRight">
<div id="bottomLeft">
Innehåll på sidan..
</div>
</div>
</div>
</body>
</html>[/RED]
Bire skrev:
SÅ här löste jag det med enbart html till https://www.envikenrecords.com & deras produktvisning:
...
Våga vägra JavaScript! ;)
Finns inte en tillstymmelse till JavaScript i mitt exempel. ;) §jr
Shit.. CSS då? :p ;) :e
Får det inte riktigt att funka i main frame. I DW visas hörnen men inte i webläsaren. Jag har säkert missat nån jäkligt elementär detalj som vanligt... ;)
Ska jag posta kod?
trodde väl det :h
Som sagt jag är ingen mästare på webben, men desto bättre på att lira gitarr ;) Här kommer koden...
[kod]
<html>
<head>
\<style type="text/css"\>
\<!--
body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
background: #9999CC url(/bilder/voh.gif) no-repeat top left;
}
\#topRight {
width: 100%;
height: 100%;
background: url(/bilder/hoh.gif) no-repeat top right;
}
\#bottomRight {
width: 100%;
height: 100%;
background: url(/bilder/hnh.gif) no-repeat bottom right;
}
\#bottomLeft {
width: 100%;
height: 100%;
background: url(/bilder/vnh.gif) no-repeat bottom left;
}
\--\>
\</style\>
</head>
<body bgcolor="#9999CC">
<div id="pageContent">
<div id="topRight">
<div id="bottomRight">
<div id="bottomLeft">
<table width="485" border="0" align="center">
<tr>
<td><h2 align="center"><font face="Verdana, Arial, Helvetica, sans-serif"><br>
Biography</font> <br>
<br>
</h2></td>
</tr>
<tr>
<td><div align="left"><font size="1" face="Verdana, Arial, Helvetica, sans-serif"><b>Joel
Sundkvist</b> is a very talented young guitarist from Sweden. At present
he is studying the guitar for <a href="http://staff.mh.luth.se/joer/" target="_blank">Jan-Olof
Eriksson</a> at the University of Music in Piteå, where he's taking
a master degree in teaching and performing. Joel has been a frequent participant
in masterclasses for several renowed guitarists such as Marco Socías,
Lucia Sanchez and Eric Lammers. For his master's degree exam in 2004 he
will be the soloist in Joaquin Rodrigo's famous Concierto de Aranjuez
for guitar and symphony orchestra.</font></div></td>
</tr>
<tr>
<td><div align="left"><font size="1" face="Verdana, Arial, Helvetica, sans-serif"><br>
Joel has a very plesant friendship with the swedish composer Tobias Lundmark
who is working on a guitar concerto dedicated to him. Chamber music is
also a precious part of Joel's repertoire. He has worked with guitarists,
flutists, violinists and singers in several musical productions. Together
with the guitarist Stefan Wester he forms <b>"DUO Wester/Sundkvist"</b>.
They have been working together since the year 2000 and have done many
successful recitals all over Sweden.<br>
Joel's intention after examination is to combine performing together with
teaching.</font></div></td>
</tr>
</table>
\</div\>
\</div\>
\</div\>
\</div\>
</body>
</html>
Hur fungerar det här?:
[RED]<html>
<head>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
background: #9999CC url(/bilder/voh.gif) no-repeat top left;
}
#topRight {
width: 100%;
height: 100%;
background: url(/bilder/hoh.gif) no-repeat top right;
}
#bottomRight {
width: 100%;
height: 100%;
background: url(/bilder/hnh.gif) no-repeat bottom right;
}
#bottomLeft {
width: 100%;
height: 100%;
background: url(/bilder/vnh.gif) no-repeat bottom left;
}
-->
</style>
</head>
<body>
<div id="topRight">
<div id="bottomRight">
<div id="bottomLeft">
<table width="485" border="0" align="center">
<tr>
<td><h2 align="center"><font face="Verdana, Arial, Helvetica, sans-serif"><br>Biography</font><br><br></h2></td>
</tr>
<tr>
<td align="left">
<font size="1" face="Verdana, Arial, Helvetica, sans-serif"><b>Joel Sundkvist</b> is a very talented young guitarist from Sweden.
At present he is studying the guitar for <a href="http://staff.mh.luth.se/joer/" target="_blank">Jan-Olof Eriksson</a> at the University of Music in Piteå, where he's taking
a master degree in teaching and performing. Joel has been a frequent participant in masterclasses for several renowed guitarists such as Marco Socías,
Lucia Sanchez and Eric Lammers. For his master's degree exam in 2004 he will be the soloist in Joaquin Rodrigo's famous Concierto de Aranjuez for guitar and symphony orchestra.</font>
</td>
</tr>
<tr>
<td align="left">
<font size="1" face="Verdana, Arial, Helvetica, sans-serif"><br>Joel has a very plesant friendship with the swedish composer Tobias Lundmark who is working on a guitar
concerto dedicated to him. Chamber music is also a precious part of Joel's repertoire. He has worked with guitarists, flutists, violinists and singers in several musical productions.
Together with the guitarist Stefan Wester he forms <b>"DUO Wester/Sundkvist"</b>. They have been working together since the year 2000 and have done many successful recitals
all over Sweden.<br>Joel's intention after examination is to combine performing together with teaching.</font></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>[/RED]
joel_sundkvist skrev:
Hörnen syns i DW men inte i IE...
Ska jag posta ett screenshot?
Yes please. :)
..ligger sidan online föresten, så man kan se den skarpt?
Får detta meddelande när jag försöker öppna dina pdf'er:
Dokumentet är skadat och kunde inte repareras
Kan du inte lägga ut den nya koden på din hemsida så man får se hur det ser ut?
