I am not sure this is the right place to ask this question but basically i have been assigned the task of creating design links for JPG's that were created in PSD,
HERE is on example of a design link.
The HTML structure used is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>ASJ Trading</title> <style type="text/css"> <!-- body { background-image: url(image-goes-here); margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-repeat:no-repeat; background-position:top center; } --> </style></head><body> <table border="0" cellpadding="0" cellspacing="0" style="width:960px;"><tr><td style="height:4480px;"></td></tr></table> </body></html>
Now basically a design link just helps a developer build a webiste and see hes on track with the design:
I need to create a design link for THIS image , look like a relatively very simple task , but i have't been able to do it. i guess i need to play with the height and width attibute in the table and td. can somebody tell me how i can create a design link ?
Thank you.
Gautam.
Seriously? 4000×2425px?
Resize the image to a sane value. say, 980px width and try again.
Why use a background image and table?
Were it me (not that I would be working from a silly PSD), I'd make a TOC page that links each image in the project.
For example:
<body> <ul> <li> <a href="">Ser# - project name - page - ver.jpg</a> </li> … </ul> </body>
cheers,
gary
Thanks Gary
Thanks gary , unfortunately i don't have that luxury of doing it the way u suggest , never mind
also sorry for the late reply .
Thank you and have a nice weekend.
Too bad
Using the image in the background of a table makes no sense at all --- unless you can clarify.
I see no obvious reason for your failure. Have you made sure the path is correct? From css location to image location? Are there any typos that cause failure?
Here is my take on both your requirement (using your code) and my suggestion. I use the same image both times in the same directory as the html. The image is simply copied from imgur. I didn't upload a copy because it is ridiculously large and anyone wanting to replicate the problem and solution can get it at imgur anyway.
<!DOCTYPE HTML> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <meta content= "width=device-width; height=device-height; initial-scale=1" name="viewport"> <title> Test document </title> <style media="screen" type="text/css"> /*<![CDATA[*/ html, body { background-color: white; background-image: url(gautamz07.jpg); background-repeat:no-repeat; background-position:top center; color: black; font: 100%/1.5 sans-serif; margin: 0; padding: 0;} p { font-size: 1em;} p img { width: 100%;} /*]]-->*/ </style> </head> <body> <table border="0" cellpadding="0" cellspacing="0" style="width:960px;"> <tr> <td style="height:4480px;"> </td> </tr> </table> <hr> <p>The better way, I think:<img src="gautamz07.jpg"></p> </body> </html>
cheers,
gary
Thanks gary
Thanks for your help gary !