頁面中，有很多樣式標簽：div標簽，對標簽定位的地方有：
1.<head>標簽里加<style>標簽，在<style>標簽中添加樣式。如：
<style> .c1{ background-color: pink; height: 100px; width: 100px; } </style>
2.在<div>標簽里直接加sytle屬性，在屬性中添加style樣式。如：<div style=‘xxx’>
3.在head標簽里添加<link>標簽，如： <link rel='stylesheet' href='xxx.css'>
對div定位的方式分：
1.id選擇器：用#標記，對id為il塊進行定義樣式，首先保證body中必須定義一個id='il'。注：一個html頁面中，不可用存在相同的Id
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> #il{ border: 1px red solid; height: 20px; width: 20px; background-image: url('http://ui.imdsx.cn/static/image/icon.png'); background-repeat: no-repeat; background-position: 0 0; } </style> </head> <body style="margin: 0 auto"> <div id="il"></div> #必須在body中定義一個id為il </body> </html>
預覽圖如下：
2.class選擇器。用點.來標記，在body中對class屬性進行定義，然后再style樣式里定義屬性的樣式。如圖：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ height: 100px; width: 100px; border: 1px red solid; text-align: center; line-height: 100px } </style> </head> <body style="margin: 0 auto"> <div class="c1">1</div> #必須在body中定義class的屬性 </body> </html>
顯示樣式如圖：
3.標簽選擇器。在style里定義標簽后，這個樣式將會影響所有的相同標簽的樣式，只是假如有其他Id或class屬性同時定義時，標簽選擇器的優先級將低於id或class的定義方式。假如在style定義一個div{}的標簽，那么body中所有的div標簽將會應用該樣式。
<html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ #這里定義標簽選擇器div，在body里的所有的div標簽將會受到影響，但是當div標簽里有定義id或class時，div定義的樣式優先級低於id或class標簽的樣式 height: 100px; width: 100px; border: 1px red solid; background-color: greenyellow; }
.c1{
height: 50px;
width: 50px;
background-color: greenyellow;
border: 1px solid rebeccapurple;
}
</style> </head> <body style="margin: 0 auto"> <div> </div> <div class="c1"></div> #這里定義class="c1",因此在style里.c1的樣式定義優先級要高於style中div的樣式 <div style="width: 100px;height: 48px;background-color: red;float: left"></div> </body> </html>