Member Avatar for SabithaSri

Please give any idea

design.png 12.23 KB
  • 10 Contributors
  • 9 Replies
  • 1K Views
  • 4 Years Discussion Span
  • Latest Post Latest Post by Sohaib_7

Recommended Answers

All 9 Replies

Member Avatar for gentlemedia

or just something like this;

HTML:
<div>
    <img src="icon-1.gif" alt="Icon 1" />
    <h2>Fully Responsive</h2>
    <p>text the bla the bla</p>
</div>
<div>
    <img src="icon-2.gif" alt="Icon 2" />
    <h2>HTML5 &amp; CSS3</h2>
    <p>text the bla the bla</p>
</div>
<div>
    <img src="icon-3.gif" alt="Icon 3" />
    <h2>Ready for use</h2>
    <p>text the bla the bla</p>
</div>
<div>
    <img src="icon-4.gif" alt="Icon 4" />
    <h2>Shortcodes</h2>
    <p>text the bla the bla</p>
</div>

CSS:
 /* Nasty CSS reset for demo purpose, but better to use a CSS reset such as normalize.css */
* {
    marging: 0;
    padding: 0;
}

/* Apply a natural box layout model to all elements */
*,
*:before,
*:after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

div {
    float: left;
    width: 25%;
    padding: 0 2rem;
    text-align: center;
}
Member Avatar for Purvi_1

Hello, here all you need to use the boostrap class !

your code is goes like this :

<div class = "col-lg-12">
    <div class="row">
     <div class="col-lg-3">
       <img></img>
       <h2></h2>
       <p></p>
     </div>
     <div class="col-lg-3">
       <img></img>
       <h2></h2>
       <p></p>
     </div>
     <div class="col-lg-3">
       <img></img>
       <h2></h2>
       <p></p>
     </div>
     <div class="col-lg-3">
       <img></img>
       <h2></h2>
       <p></p>
     </div>    
    </div>  
</div>

Here, you have to use your custom css style, image and content.

Member Avatar for ichigo_1

Now I work as web developer and in my work I contacted with UX/UI web designers from different It companies like Effective Soft Corporation But I am also interested in interface design so I need more practise with photoshop. You know I think UI design makes an application or website more attractive.

Member Avatar for kipsy

It is very easy, try to do the function "lining" in photoshop and make one circle and copy it several times. I did a lot of design in my property in Portugal during quarantine, so if you need help I am here

Member Avatar for Holistic_1

its simple
you can make this type of picture in photoshop

Member Avatar for Sohaib_7

Nice post

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.