Displaying of image by using css

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Guest

    Displaying of image by using css

    How can i display image by using cascading style sheet without using src attribute in image tag???

    looking for an early response

    Thanks
  • punjabi_munda
    Junior Member
    • Feb 2006
    • 9

    #2
    use image asa background

    hello
    you can use image as a background in your css
    first u make a cl***
    .image{
    background:url('path of the image');
    height:100px;
    }

    and use in html file
    <div cl***="image"></div>
    so you can display image without using img src in html files.

    Comment

    • emily123
      Junior Member
      • Dec 2009
      • 5

      #3
      Hello
      Our Web Development forum category encomp***es everything related to building a website from the ground up. Topics include serverside scripting, clientside scripting, databases, and web / graphic design. When posting programming code, encase it in [code], [code=syntax], or [icode] bbcode tags. Please only link to your website if it is necessary to demonstrate how something isn't working.
      Our Web Design sub-category encomp***es everything related to graphics, 3D modeling, web design, and Adobe and Macromedia products. You can ask for constructive criticism on your new designs within the Website Reviews forum of our Business Exchange category.
      Thanks.

      Comment

      • Guest

        #4
        Originally posted by punjabi_munda
        hello
        you can use image as a background in your css
        first u make a cl***
        .image{
        background:url('path of the image');
        height:100px;
        }

        and use in html file
        <div cl***="image"></div>
        so you can display image without using img src in html files.
        Add no repeat tag otherwise bg images will repeat itself in HTML based web sites

        Comment

        • shalimar
          Member
          • Dec 2009
          • 52

          #5
          nice thread..

          Comment

          • stevex
            Member
            • Apr 2014
            • 74

            #6
            Its useful information for me.I was using always src tag for it.I have learn a new concept now.

            Comment

            • nisha
              Junior Member
              • Aug 2014
              • 17

              #7
              Here's the format for placing an image:

              <IMG SRC="image.gif" ALT="some text" WIDTH=32 HEIGHT=32>

              Comment

              • v1technologies123
                Junior Member
                • Oct 2015
                • 10

                #8
                Useful information, thanks for sharing.

                Comment

                • sonia sharma
                  Senior Member
                  • Jul 2015
                  • 156

                  #9
                  Advantage of Using CSS Image Sprite

                  Sprites are the images of two dimensional which are made by combining a number of small images into one larger image at defined coordinates X and Y . A single web page with numerous images, particularly many small images, such as icons, buttons, etc, can take a long time to load and generates multiple server requests. By using the image sprites instead of separating images will significantly reduce the number of HTTP requests a browser makes to the server, which can be very effective for improving the loading time of web pages and moreover overall site performance.

                  Comment

                  • Guest

                    #10
                    Thanks for sharing this kind of informational stuff.

                    Comment

                    • guardstogo
                      Junior Member
                      • Oct 2015
                      • 4

                      #11
                      Topics include serverside scripting, clientside scripting, databases, and web / graphic design. When posting programming code, encase it in [code], [code=syntax], or [icode] bbcode tags.

                      Comment

                      • hina
                        Junior Member
                        • Dec 2015
                        • 3

                        #12
                        You could use following code for it
                        <style type="text/css" media="screen">
                        #headline1 { background-image: url(images/image_name.jpg); background-repeat: no-repeat; background-position: left top; padding-top:68px; margin-bottom:50px; }

                        Comment

                        • Guest

                          #13
                          Punjaabi munda is right..

                          Comment

                          Working...
                          😀
                          😂
                          🥰
                          😘
                          🤢
                          😎
                          😞
                          😡
                          👍
                          👎