CSS_스타일 Sample
2733 단어 sample
<!DOCTYPE HTML>
<html>
<head>
<title>div </title>
<style type="text/css">
body{
margin: 0px 1px 2px 3px;
}
#father{
background-color: yellow;
width: 100%;
height: 100px;
border: dashed green;
}
#son1{
float: left;
}
#son2{
float: left;
}
#son3{
float: left;
}
#clear{
clear: both;
}
</style>
</head>
<body>
<!-- div , div -->
<div id="father">
<div id="son1">aaaaaa</div>
<div id="son2">bbbbbb</div>
<div id="son3">cccccc</div>
<div id="clear"></div>
<div>dddddddddddd</div>
</div>
</body>
</html> <!DOCTYPE HTML>
<html>
<head>
<title>div </title>
<style type="text/css">
body{
margin: 0px 1px 2px 3px;
}
#father{
background-color: yellow;
width: 100%;
height: 100px;
border: dashed green;
position:relative;
}
#son1{
position: absolute;
margin-left: 60%;
}
#son2{
}
</style>
</head>
<body>
<!-- ， -->
<!-- ， -->
<!-- ， , -->
<!--result bbbbbb aaaaaaaaaa-->
<div id="father">
<div id="son1">aaaaaa</div>
<div id="son2">bbbbbb</div>
</div>
</body>
</html> <!DOCTYPE HTML>
<html>
<head>
<title>div </title>
<style type="text/css">
#father{
background-color: yellow;
width: 100%;
height: 100px;
border:1px dashed green;
}
#son1，#son2,#son3{
background-color: green;
width: 100px;
margin-left: 5px;
margin-top: 5px;
display: inline; /*3 div */
}
#son3{
display: none; /* div*/
}
#son2:hover,#son1:hover{
background-color: blue;
cursor: hand;
}
</style>
</head>
<body>
<div id="father">
<div id="son1">aaaaaa</div>
<div id="son2">bbbbbb</div>
<div id="son3">bbbbbb</div>
</div>
</body>
</html>이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
CSS_스타일 Sample텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
