HOME | PHP Tutorial | CSS
facebook icon
AgerNic.com
WEB DEVELOPER SITE, HTML, CSS, PHP
HTML Tutorial

CSS Tutorial

HTML div style - div style class

Inserting a style for div style there are three ways:
External style sheet,
Internal style sheet,
Inline style,
For any <div> on your page, you can specify any CSS property as: color, font-style, font-family, font-size, background, etc.

Inline html div style

Here in example 1 we give css to div of height, width, background and color.
Example 1:
<div style="height:300px; width:450px; color:#000000; background:#CCC"> Add your text here</div>
Note: try to avoid inline-css, you have to make external HTML div style.

Internal and external style of html div

You can archieve same using Internal or External CSS
1. Internal style for html div.
Example2:
<html >
<head>
<style>
div {
height:50px;
width:50px;
background-color:red;
}
</style>
</head>
<body>
<div> Here your text</div>
</body>
</html >
2. External style for html div.
Example 3: named index.html and we add external file named style.css in Example 4.
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div></div>
</body>
Example 4 named style.css
div
{
height:350px;
width:450px;
background-color:red;
color: #000000;
}

HTML div style class

The HTML div style class attribute is used to define equal styles for item with the same class name.
So, all HTML div style class item with the same attribute will have the same format and style.
Here we have three HTML <div> class elements that point to the same class name:
Example 5:
<!DOCTYPE html>
<html>
<head>
<style>
.town {
  background-color: #CCC;
  color: #000000;
  margin: 12px;
  padding: 15px;

</style>
</head>
<body>

<div class="town">
  <h2>ROMA</h2>
  <p>ROMA is the capital of Italy.</p>
</div>

<div class="town">
  <h2>MADRID</h2>
  <p>Madrid is the capital of Spain.</p>
</div>

<div class="town">
  <h2>SEOUL</h2>
  <p>Seoul is not the capital of Japan.</p>
</div>

</body>
</html>
Note. Use External style sheet

HTML div style, div style class HTML div style - div style class - html tutorial

3203. HTML - Elements: body, head, title, html tutorial
HTML - Elements: body, head, title html tutorial
https://www.agernic.com/html-tutorial/html-elements-as-body-head-and-title.html

2614. Basics : Introduction - HTML Tutorial
HTML basics - HTML tutorial
http://www.echoecho.com/htmlbasics.htm

2613. Backgrounds : Fixed Image - HTML tutorial
HTML backgrounds - HTML tutorial
http://www.echoecho.com/htmlbackgrounds03.htm

2686. Tables : Row/Cell Tags - HTML Tutorial
HTML tables - HTML tutorial
http://www.echoecho.com/htmltables03.htm

2668. Links : Advanced Text Links - HTML Tutorial
HTML links - HTML tutorial
http://www.echoecho.com/htmllinks05.htm

2612. Backgrounds : Background Image - HTML tutorial
HTML backgrounds - HTML tutorial
http://www.echoecho.com/htmlbackgrounds02.htm

Your add here
How to get PHP errors to display?
How to prevent sql injection in php mysqli
How do I get PHP errors to display - PHP error_reporting()
mysql_query(): The mysql extension is deprecated and will be removed i
Function eregi_replace() is deprecated in php - How to fix
PHP delete an element from an array
Uncaught Error: Call to undefined function MYSQL_NUM_ROWS() in
Deprecated: mysql_connect() mysql extension is deprecated and will be
mysqli_fetch_array() expects parameter 1 to be mysqli_result boolean g
SQL IN Operator - example
SQL BETWEEN Operator
SQL like syntax and example
SQL WHERE AND & OR multiple conditions
SQL create table primary key autoincrement
PHP mysqli_connect () Function
SQL COUNT(), AVG() and SUM() Functions
Display data from SQL database with MySQLi into php - html table
SQL CREATE DATABASE - example
SQL mysql order by columns, by date, by asc, by desc, random with PHP
PHP mysqli_query() Function - mysqli query
SQL delete row - SQL delete table
SQL update - SQL update select
Insert into SQL - Insert into table SQL - Insert data in sql
Login in PHP - simple login script with PHP MYSQL