2 Replies Latest reply on Jan 31, 2011 5:55 AM by garywpaul

    Posting Text Links on top of Image

    mkhit5

      Good Evening,
      I have searched the internet and cannot find a straight answer to this question. This is for Dreamweaver CS5

       

      I am trying to set up my menu hyperlinks at the top of my webpage. The links Home, Contact exc. are located inside a table cell. Behind the text I need to have a photo.

      How do I overlay the text? Or how do I set a background image for just that one cell and not the whole page? Don't forget once the text is on top of the photo I need to turn that text into hyperlinks(which I can do but that eliminates using a program like paintbrush to type the letters on top of the photo)  I am not great with the coding so if the answer is with code could you try and be specific.

       

      I greatly appreciate any help you have. Thank you and have a great night.

        • 1. Re: Posting Text Links on top of Image
          james2483 Level 1

          If Im correct you wanna have images behind each of your menu buttons right....?


          I would take your menu options out of a table and put them in an "unordered list" first.

           

          Then you will be able to create different list items. (Home, Contact etc )

           

          It looks like this

           

          <ul>

              <li>Home </li>

              <li> Contact</li>

          </ul>

           

          After this you can style each "li" individually  aswell as the "ul" as a whole and if you want making them hyperlinks by inserting your "a" tags in each of them.

           

          If you want an image behind the menu it might be worth wrapping the "ul" in a "div tag" and setting the background image in that.

           

          Look up something called "css navigation menu's" and css rollovers"

           

          P.s the paintbrush idea can definately be avoided.

          • 2. Re: Posting Text Links on top of Image
            garywpaul Level 5

            Sounds like you have one image (a photo) that you want your links on top of....correct.  Put a background image in your table.

             

            <table background="path/filename.ext">

             

            You can also do it in css

             

            .tablebgimage     {

                 background-image:url(path/filename.ext);

                 }

             

            <table class ="tablebgimage">

             

            If you change to the <ul> as suggested, simple put the bg image in the element

             

            <div class="tablebgimage">

            <ul>
            <li><a href="path/filename.ext">Home</a></li>
            </ul>

            </div>

             

            Gary