HTML에서의 위치 사용법 소개
- 高洛峰원래의
- 2017-03-07 11:29:423109검색
일반적인 태그가 완료할 수 없는 작업을 완료하는 데 사용할 수 있는 HTML의 위치 속성은 누구나 잘 알고 있을 것입니다.
어제 HTML 콘텐츠를 좀 배웠는데, JD.com에 검색창을 만들고 싶어서 드디어 만들었는데, 장바구니 결제를 했더니 거기에 숫자가 표시되어 있었는데 안 만들었어요. 어떻게 추가해야 할지 모르겠습니다. 장바구니와 함께 숫자를 이동하려면 함께 배치해야 합니다. 위치 지정에는 반드시 위치가 필요합니다. 먼저 숫자의 위치를 절대값으로 설정합니다. 왜냐하면 이때 디지털 위치의 상위 태그가 body이기 때문에 상단과 좌측 설정 시 장바구니의 원하는 위치로 설정할 수도 있습니다. 그러나 장바구니의 여백을 변경하면 둘은 불가능합니다. 함께 이동하므로 장바구니의 위치를 설정합니다. 장바구니의 여백을 어떻게 조정하더라도 숫자 위치의 상위 태그가 장바구니가 되도록 합니다. ...
코드는 다음과 같습니다.
<html>
<head>
<title>day03.html</title>
<style type="text/css">
/*首先写一个position的p*/
#car{
width:150px;height:30px;
background: #999999;
color:white;text-align: center;
line-height: 30px;margin: 232px 300px;
border:1px solid black;position: relative;
}
#num{
width:20px;height:20px;background: red;
color:white;text-aligh:center;
line-height:20px;position: absolute;
top:-15px;left:25px;
}
</style>
</head>
<body>
<p id="car">
去购物车付款
<p id="num">0</p>
</p>
</body>
</html>html에서 위치 사용법에 대한 더 많은 관련 기사를 보려면 PHP 중국어 웹사이트를 주목하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사：HTML에서 특정 텍스트를 숨기는 방법 소개다음 기사：HTML에서 특정 텍스트를 숨기는 방법 소개