How to make a HTML div ( with image and text ) in a image?

by wordpressmania

Posted: 12 years ago 9 replies

PROGRAMMING

I can do it using PHP GD libraty. But I am seeking anther option to do it.

I want to make a HTML div with image and text into image. I heared about HTML5 canvas element but not sure how to do it. I am free to use javascript or PHP.

I am trying to do it for last couple of days.......
Any suggestion and comments are more than welcome....

Thanks in advance
Sabbir

#div #html #image #make #text

AdWordsUzmani

12 years ago

You can use image as background image and then write what you want.

<div style="display;block;width:100px;height:100px;back ground:url("yourimage.jpg") no-repeat">
<span>Your Text</span>
</div>

And you can change span position.

Thanks
1 reply

{{ DiscussionBoard.errors[6775071].message }}

Bokva

12 years ago

Use background as AdWordsUzmani said or if you want overlapping of many divs with any content, use z-index CSS property like in this tutorial:

Lesson 15: Layer on layer with z-index (Layers) - HTML.net

Thanks
1 reply

Signature

Take ACTION!

{{ DiscussionBoard.errors[6775097].message }}

wordpressmania

12 years ago

Originally Posted by Bokva

Hi,
I do not need html or css solution. I need a php or java script solution so that I can make a html div with all the content inside that into a image......

Hope this make sense...

Thanks

Signature

Get OnlineBiz Lead Gen WP Theme for $4 & Choose another from our entire theme gallery ( 138 themes )!
Download Free WordPress Themes - Designed With Love By Sabbir H

{{ DiscussionBoard.errors[6775142].message }}

Bokva 12 years ago

So, just to be clear -- you want only one image as a result?
- Thanks
- 1 reply
Signature

Take ACTION!
{{ DiscussionBoard.errors[6775203].message }}
- wordpressmania 12 years ago
  
  Originally Posted by Bokva
  
  So, just to be clear -- you want only one image as a result?
  
  Hello....
  
  <div id="make_image"><img src="#" /><h2>Title</h2>Some text <img src="#" /><h2>Title</h2>Some text</div>
  
  I want to make this div ( id="make_image" ) a image so that user can download that image.
  
  So the final image will look alike the html exactly same as it will be seen on the web browser with css...
  
  P.S. I did that with PHP GD library with my own. But I am trying to make it from a html div.
  
  Thanks
  
  Signature
  
  Get OnlineBiz Lead Gen WP Theme for $4 & Choose another from our entire theme gallery ( 138 themes )!
  Download Free WordPress Themes - Designed With Love By Sabbir H
  
  {{ DiscussionBoard.errors[6775532].message }}
YongC 12 years ago

Your mean is add text to image using php or javascript ?
- Thanks
{{ DiscussionBoard.errors[6775232].message }}
wordpressmania 12 years ago

I am sorry for my bad English but I am trying my best to tell you what I want
- Thanks
Signature

Get OnlineBiz Lead Gen WP Theme for $4 & Choose another from our entire theme gallery ( 138 themes )!
Download Free WordPress Themes - Designed With Love By Sabbir H
{{ DiscussionBoard.errors[6775534].message }}
AdWordsUzmani 12 years ago

I think you looking for this
Home - html2canvas - Screenshots with JavaScript
- Thanks
{{ DiscussionBoard.errors[6778826].message }}
mmrumii 12 years ago

I have some css and html pdf tutorial and it's easy to understand.
if you want , just pm me I'll send you soon. where you can learn it easily .
- Thanks
Signature
Blog about Content Locking and CPA
{{ DiscussionBoard.errors[6778941].message }}

How to make a HTML div ( with image and text ) in a image?

Trending Topics

Google Ads, landing pages, and Clickbank links

Carry out better target audience research

YouTube gets shopping display tools and affiliate partnership updates

A Very Strange Internet Problem

Membership area with multiple income streams