用户名 密码 左边右对齐 右边左对齐
Html:
用户名:
密码:
Css:
dl{width:310px;
margin-left:auto;
margin-right:auto;
}
dt{margin:0px;
width:100px;
font-size:blod; 1.0 Transitional//EN
font-weight:normal;
text-align:right;
float:left;
}
dd{margin:0px;
width:200px;
font-size:12px;
font-weight:normal;
folat:left;}
书名 页数
Html:
书名1
第1页
书名2
1.0 Transitional//EN
第2页
书名3
第3页
书名4
第4页
Css:
dl{position:relative;
width:100%;
padding-top:5px;
}
dt,dd{padding:0px;
margin:0px;
}
dt,before{content:
dd{top:0px;
right:2px;
position:absolute;}
#div1{width:500px;
background:pink;
margin-left:auto;
margin-right:auto;}
绝对定位：
HTML：
ABC
1.0 Transitional//EN
CSS：
#divleft{font-weight:bold;
font-size:20px;
color:blue;
position:relative;
top:-12px （决定字在上方还是下方）
}
.div1{border:3px solid red;
position:relative;}
#divcenter{background-color:blue;
width:400px;
height:400px;
margin-left:auto;
margin-right:auto;}
#divc{background-color:pink;
width:100px;
height:100px;
position:absolute;
top:50px;
left:50px;
z-index:3; （z-index大的在上面）
}
#dive{ background-color:purple;
width:100px;
height:100px;
z-index:1;
}
两框并排
HTML：
1.0 Transitional//EN
CSS：
.div1{border:3px solid red;
position:relative;}
#divcenter{background-color:blue;
width:400px;
height:400px;
margin-left:auto;
margin-right:auto;}
#divc{
background-color:pink;
width:100px;
height:100px;
float:left;
}
#dive{
background-color:purple;
width:100px;
height:100px;
float:left;
}
标题 链接：
HTML：
Html page (这是标题)
Gintama!
字体大小 粗细:
CSS中:
font-size:20px;
font-weight:bold;(加粗) hello.html需要连接的HTML名 （
用户名 密码 左边右对齐 右边左对齐
Html:
用户名:
密码:
Css:
dl{width:310px;
margin-left:auto;
margin-right:auto;
}
dt{margin:0px;
width:100px;
font-size:blod; 1.0 Transitional//EN
font-weight:normal;
text-align:right;
float:left;
}
dd{margin:0px;
width:200px;
font-size:12px;
font-weight:normal;
folat:left;}
书名 页数
Html:
书名1
第1页
书名2
1.0 Transitional//EN
第2页
书名3
第3页
书名4
第4页
Css:
dl{position:relative;
width:100%;
padding-top:5px;
}
dt,dd{padding:0px;
margin:0px;
}
dt,before{content:
dd{top:0px;
right:2px;
position:absolute;}
#div1{width:500px;
background:pink;
margin-left:auto;
margin-right:auto;}
绝对定位：
HTML：
ABC
1.0 Transitional//EN
CSS：
#divleft{font-weight:bold;
font-size:20px;
color:blue;
position:relative;
top:-12px （决定字在上方还是下方）
}
.div1{border:3px solid red;
position:relative;}
#divcenter{background-color:blue;
width:400px;
height:400px;
margin-left:auto;
margin-right:auto;}
#divc{background-color:pink;
width:100px;
height:100px;
position:absolute;
top:50px;
left:50px;
z-index:3; （z-index大的在上面）
}
#dive{ background-color:purple;
width:100px;
height:100px;
z-index:1;
}
两框并排
HTML：
1.0 Transitional//EN
CSS：
.div1{border:3px solid red;
position:relative;}
#divcenter{background-color:blue;
width:400px;
height:400px;
margin-left:auto;
margin-right:auto;}
#divc{
background-color:pink;
width:100px;
height:100px;
float:left;
}
#dive{
background-color:purple;
width:100px;
height:100px;
float:left;
}
标题 链接：
HTML：
Html page (这是标题)
Gintama!
字体大小 粗细:
CSS中:
font-size:20px;
font-weight:bold;(加粗) hello.html需要连接的HTML名 （