HTML 베이스(CSS)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> </title>
<style>
/*style head ， */
/* */
div{
font-size: 20px;
}
/*ID */
#id_test{
background-color: red;
}
/* */
.class_test{
color:green;
}
/* */
.container li .a1 #b1{
color: deepskyblue;
}
/* */
.container2 li .a2,.b2{
color: deepskyblue;
}
/* */
.container3 input[type="text"][name="test"]{
border: 3px solid red;
}
</style>
</head>
<body id="top">
<h2> （ ）</h2>
<div>
<p> ： div 20px</p>
</div>
<hr>
<h2>ID （ ID ）</h2>
<p id="id_test"> ： id id_test red</p>
<hr>
<h2>class （ class ）</h2>
<p class="class_test"> ： class class_test green</p>
<hr>
<div class="container">
<h2> （ ）</h2>
<p> ： class container li class a1 id b1 deepskyblue</p>
<ul>
<li>
<a class="a1">
<b id="b1">1</b>
</a>
</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
<hr>
<div class="container2">
<h2> （ ， ）</h2>
<p> ： class container2 li class a2 b2 deepskyblue</p>
<ul>
<li>
<b class="a2">1</b>
</li>
<li>
<b class="b2">2</b>
</li>
<li>3</li>
<li>4</li>
</ul>
</div>
<hr>
<div class="container3">
<h2> （ ， ）</h2>
<p> ： class container3 input type text name test </p>
<input name="test" type="text">
<input type="text">
<input type="file">
<input type="button">
<input type="reset">
</div>
<hr>
<h2> </h2>
<p>padding( )
： 100px div 20px div, 10px</p>
<div style="border: 2px solid red;height: 100px">
<div style="background-color: green;height: 20px;padding: 10px;"></div>
</div>
<p>margin( )
： 100px div 20px div, 10px</p>
<div style="border: 2px solid red;height: 100px">
<div style="background-color: blue;height: 20px;margin: 10px"></div>
</div>
<hr>
<h2>position</h2>
<p> ， </p>
<a style="position: fixed;right: 30px;bottom: 60px" href="#top"> </a>
<p> , </p>
<div style="position: relative;background-color: #dddddd;width: 100px;height:100px;margin: 0 auto;">
<h3> </h3>
<a style="position: absolute;right: 0px;bottom: 0px;"> </a>
</div>
<hr>
<h1>display</h1>
<p>none: </p>
<p>block: </p>
<p>inline: </p>
<hr>
<h2>float</h2>
<p> ， ， div </p>
<div style="background-color: greenyellow">
<div style="float: left">DIV1</div>
<div style="float: left">DIV2</div>
<div style="clear: both"></div>
</div>
<hr>
<h2>overflow</h2>
<p> ， </p>
<div style="overflow: auto;height: 50px;background-color: green">
1<br />
2<br />
3<br />
4<br />
5<br />
</div>
</body>
</html>이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다른 사람의 웹사이트 편집: contenteditable 및 designMode그래도 우리가 그렇게 할 수 있다고 생각하는 것은 멋진 일입니다. 제가 강조하고 싶었던 일종의 관련 API가 실제로 몇 개 있기 때문에 오늘 그것을 가져왔습니다. contenteditable는 "true" 값이 할당...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
