开发者

basic html css design of a box with image and title

开发者 https://www.devze.com 2023-01-05 21:31 出处:网络
I am not a very good designer. At least not with html and css. I have been using a very simple code like this:

I am not a very good designer. At least not with html and css. I have been using a very simple code like this:

<fieldset style=\"color: #000000; border: 1px solid #000000; width: 225px; text-align: left; padding: 5px;\">
<legend style=\"color: #999999; font-weight: bold;\">Headline.</legend>
<p>text</p>
</fieldset>

To output information in a php online game i am working on. I need something similar, put a little better looking. Can I get some help. I was thinking something like:

<h2 class="entry-title">Example</h2>
<img= examples.jpg" >
<div class="entry-content">
</div>

But im not sure what css code i can write to make a similar effect to the fieldset/legend that im currently using. I need a box with a title, an image o开发者_如何转开发n the left side and tekst on the right side of the image.


You could try use the div block below.

<div class="fieldset">
<h2 class="entry-title">Example</h2>
<img= examples.jpg" >
<div class="entry-content">
</div>
</div>

As styling, first give a border to your fieldset div. Then, you could just position the h2 tag relatively to your fieldset div playing top and left values. and be sure that your body background, filedset div's background and h2 tag's background is the same. Finally float both div entry-content and the image to left.

With a little tweaking you should get a similar looking of tag.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号