Friday, September 19, 2014
On 9:40 AM by Unknown in Artcell,
Coding,
CSS,
Free templates,
HTML,
HTML/CSS,
Templates
No comments
Like the article?
Just done with a new template with HTML/CSS. Artcell, one of my favorite bands. I've developed a template for them with my developers team using simple HTML/CSS coding. And of course the template is supported in all kind of devices!
Browser Support:
- Google Chrome / Chromium
- Mozilla Firefox
- Internet Explorer
- All kind of Mobile Devices
- All kind of Tablets
Here is the look of the Responsive Artcell HTML/CSS Template:
Here is the HTML Part:
And, Here is the CSS Part:
This is a free template. Anybody is free to use this. Subscribe for more!
Browser Support:
- Google Chrome / Chromium
- Mozilla Firefox
- Internet Explorer
- All kind of Mobile Devices
- All kind of Tablets
Here is the look of the Responsive Artcell HTML/CSS Template:
HTML/CSS Artcell Responsive Template |
Here is the HTML Part:
<html>
<head>
<link href="style.css" rel="Stylesheet"/>
</head>
<body>
<div class="wrapper">
<div class="top_bar">
<h2> ARTCELL</h2>
</div>
<div class="text_area">
<p>
Arcell is a famous undergroud rock Band from Dhaka. It was formed in 1999 and there are doing well current time.
The current band members are Ershad, Shaju, Lincon, Cezanne. They develop their songs based on heavy rock, heavy metal
format. In country, they are counted as one of the leading bands. Ershad is their main vocal.
</p>
</div>
<div class="albums">
<h2>Albums</h2>
</div>
<div class="albums_holder">
<a class="link1s" href="#"> Dhushor Somoy </a>
<a class="link1s" href="#">Aniket Prantor</a>
<a class="link1s" href="#">Mixed Rockers</a>
<a class="link1s" href="#">Rock 202</a>
<a class="link1s" href="#">Unreleased</a>
</div>
<div class="bandmembers">
<h2>Band Members</h2>
</div>
<div class="band_members_full">
<div class="single_member"><a class="link2s" href="#"><img class="img1" alt="artist" src="member.PNG" /></a></div>
<div class="single_member"><a class="link2s" href="#"><img class="img1" alt="artist" src="member.PNG" /></a></div>
<div class="single_member"><a class="link2s" href="#"><img class="img1" alt="artist" src="member.PNG" /></a></div>
<div class="single_member"><a class="link2s" href="#"><img class="img1" alt="artist" src="member.PNG" /></a></div>
</div>
<div class="footer">
<a class="link3" href="http://carnivalbd.com/apps">Developed by: Carnivalbd.com</a>
</div>
</div>
</body>
</html>
And, Here is the CSS Part:
.wrapper {
padding: 0% 2% 0% 2%;
}
.top_bar {
width: 100%;
height: 80px;
color: #2b3c50;
text-align: center;
}
.top_bar h2 {
font-size: 48px;
border-bottom: 1px dashed #2b3c50;
padding-bottom: 20px;
margin-bottom: 30px;
}
.text_area {
border-left: 8px solid #2b3c50;
height: auto;
width: 94%;
text-align: justify;
padding: 5px 4% 5px 2%;
margin-top: 20px;
margin-bottom: 50px;
background: #f9f9f9;
}
.albums h2 {
padding: 0px 0px 0px 2%;
border-left: 8px solid #2b3c50;
font-size: 30px;
color: #2b3c50;
background: #f9f9f9;
width: 98%;
}
.albums_holder {
height: auto;
width: 100%;
overflow: hidden;
}
a.link1s:link , a.link1s:visited, a.link1s:hover{
color: #f9f9f9;
background: #2b3c50;
width: 96%;
height: 35px;
text-decoration: none;
margin: 5px 2% 5px 2%;
padding: 10px 0px 0px 10px;
float: left;
}
.bandmembers {
height: auto;
width: 100%;
}
.bandmembers h2 {
padding: 0px 0px 0px 2%;
border-left: 8px solid #2b3c50;
font-size: 30px;
color: #2b3c50;
background: #f9f9f9;
width: 98%;
}
.band_members_full {
width: 100%;
}
.single_member {
height: auto;
width: 20%;
border: 1px solid #2b3c50;
float: left;
margin: 2%;
}
.img1 {
width: 100%;
border: none;
}
a.link2s:link , a.link2s:visited {
}
.footer {
height: 70px;
width: 98%;
border-top: 5px solid #000;
padding: 40px 10px 10px 10px;
text-align: center;
background: #2b3c50;
overflow: hidden;
margin-top: 15px;
}
a.link3:link , a.link3:visited{
color: #f9f9f9;
text-shadow: 1px 1px #000;
font-size: 20px;
text-decoration: none;
display: block;
}
This is a free template. Anybody is free to use this. Subscribe for more!
RELATED POSTS
Subscribe to:
Post Comments (Atom)
Search
Powered by Blogger.
Contact with Rubel
Popular Articles
-
Hello mobile apps developers! if you are developing Mobile application in Phonegap platform. You might face a problem in sometime ' C...
-
Hello Google Play Android Developers! Recently, Google is forcing its developers to use Android Studio rather than using Android Developmen...
-
Hello developers! Hope you are doing well. Many people are coming to application developing, specially in the Android arena. Now, What! Th...
-
Polymorphism We are going to create four Java class in our Polymorphism class. Those are: 1. human.java class 2. women.java class...
-
Even if you are not from Computer Engineering background, still you can have Career in Mobile Application Development. Honestly speaking, b...
-
People related to programming and coding often make mistakes or misuse the words Coders and Programmers by not knowing properly. So, questi...
-
Today we are going to learn Inheritance in JAVA. I've created four java class file. Those are: 1. fatherswealth.java ( Superclass ) ...
Tags
- About Me
- admob
- advice
- Android
- Android Development
- android help
- Android SDK set Up
- Android Studio
- Apps development
- Artcell
- bluehost
- body building
- Can't you make your body building at home?
- Career
- career opportunities
- Coding
- coding problem
- computer science and engineering
- cse
- CSS
- css tricks
- Differences Between Programmers and Coders
- Do you really need to go at Gym?
- Do you really need to go to Gym for having a good shaped body?
- Education
- engineering
- Error
- experience sharing
- fitness center
- Free templates
- good life advice
- google adsense
- google adsense success
- google play
- google play account open
- gym
- hostgator
- How can I get a Google Adsense account
- How to be a freelance
- How to develop android application
- how to develop mobile application
- how to earn money online
- how to make money online
- how to monetize mobile application
- HTML
- HTML/CSS
- Java Tutorial
- Lifestyle
- Linux
- Linux Os
- making money online
- Mobile Application Development
- mosharrof rubel
- noakhali zilla school
- online earning tips
- online earning ways
- phonegap
- Phonegap problem
- Programming
- r cannot be resolved to a variable type
- rubel
- software engineering
- southeast university
- Templates
- Ubuntu
- Ubuntu Help
- web hosting buy
- web hosting reseller
- why computer science?
- wordpress theme
Techonlogy
Subscribe Here
Label
- About Me
- admob
- advice
- Android
- Android Development
- android help
- Android SDK set Up
- Android Studio
- Apps development
- Artcell
- bluehost
- body building
- Can't you make your body building at home?
- Career
- career opportunities
- Coding
- coding problem
- computer science and engineering
- cse
- CSS
- css tricks
- Differences Between Programmers and Coders
- Do you really need to go at Gym?
- Do you really need to go to Gym for having a good shaped body?
- Education
- engineering
- Error
- experience sharing
- fitness center
- Free templates
- good life advice
- google adsense
- google adsense success
- google play
- google play account open
- gym
- hostgator
- How can I get a Google Adsense account
- How to be a freelance
- How to develop android application
- how to develop mobile application
- how to earn money online
- how to make money online
- how to monetize mobile application
- HTML
- HTML/CSS
- Java Tutorial
- Lifestyle
- Linux
- Linux Os
- making money online
- Mobile Application Development
- mosharrof rubel
- noakhali zilla school
- online earning tips
- online earning ways
- phonegap
- Phonegap problem
- Programming
- r cannot be resolved to a variable type
- rubel
- software engineering
- southeast university
- Templates
- Ubuntu
- Ubuntu Help
- web hosting buy
- web hosting reseller
- why computer science?
- wordpress theme
Sponsor
Categories
- About Me
- admob
- advice
- Android
- Android Development
- android help
- Android SDK set Up
- Android Studio
- Apps development
- Artcell
- bluehost
- body building
- Can't you make your body building at home?
- Career
- career opportunities
- Coding
- coding problem
- computer science and engineering
- cse
- CSS
- css tricks
- Differences Between Programmers and Coders
- Do you really need to go at Gym?
- Do you really need to go to Gym for having a good shaped body?
- Education
- engineering
- Error
- experience sharing
- fitness center
- Free templates
- good life advice
- google adsense
- google adsense success
- google play
- google play account open
- gym
- hostgator
- How can I get a Google Adsense account
- How to be a freelance
- How to develop android application
- how to develop mobile application
- how to earn money online
- how to make money online
- how to monetize mobile application
- HTML
- HTML/CSS
- Java Tutorial
- Lifestyle
- Linux
- Linux Os
- making money online
- Mobile Application Development
- mosharrof rubel
- noakhali zilla school
- online earning tips
- online earning ways
- phonegap
- Phonegap problem
- Programming
- r cannot be resolved to a variable type
- rubel
- software engineering
- southeast university
- Templates
- Ubuntu
- Ubuntu Help
- web hosting buy
- web hosting reseller
- why computer science?
- wordpress theme
About
Social Share
Recent
Business
Video
Gallery
videos
Popular Posts
-
Hello mobile apps developers! if you are developing Mobile application in Phonegap platform. You might face a problem in sometime ' C...
-
Hello Google Play Android Developers! Recently, Google is forcing its developers to use Android Studio rather than using Android Developmen...
-
Even if you are not from Computer Engineering background, still you can have Career in Mobile Application Development. Honestly speaking, b...
-
You could find this topic little bit interesting and may not be hoping from me! Well, I was at gym for almost one year and I think I'm ...
-
Today, we are going to learn about Thread in JAVA. simpleThread.java Class public class simpleThread implements Runnable { /* ...
-
Polymorphism We are going to create four Java class in our Polymorphism class. Those are: 1. human.java class 2. women.java class...
-
Array: An array is something more or less like a container of data. Array container contains same type of data. Read More from Orac...
-
People related to programming and coding often make mistakes or misuse the words Coders and Programmers by not knowing properly. So, questi...
-
Today we are going to learn Inheritance in JAVA. I've created four java class file. Those are: 1. fatherswealth.java ( Superclass ) ...
-
Hello developers! Hope you are doing well. Many people are coming to application developing, specially in the Android arena. Now, What! Th...
0 comments:
Post a Comment