티스토리 뷰
<span style="float:left">Label</span><span style="float:left">Some-text-here</span>
JsFiddle.
-------------------If you use floats to position the texts next to each other they'll still be considered separate paragraphs and achieve the desired result.
<html>
<body>
<div style="float:left">Label:</div>
<div style="float:left">some text here</div>
</body>
</html>
-------------------This is somewhat of an extension to AXO's answer, but the perfect CSS rule would be user-select: contain;
, which will prevent selections from crossing the element boundary. This value, however, is only supported in IE/Edge.
흥미로운 재산 불구 user-select: all;
하고 user-select: none;
즉 all
한 번의 클릭으로 전체 요소를 강조하며, all
내부에 넣을 수 none
와 비슷한 효과를 생성, contain
당신은 넣어 경우 user-select: all;
와 부모 요소 내에서 원하는 요소를 user-select: none;
. 이것은 선택되지 않도록하려는 요소 사이에 맨 텍스트가있는 경우 특히 유용하지만이 솔루션을 사용하면 선택 항목이 상위 요소를 넘어서 확장 될 수 있으므로 실제로 선택 항목을 포함하지 않습니다. .
예:
.unselectable {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
.selectall {
-moz-user-select: all;
-webkit-user-select: all;
-ms-user-select: all;
}
<p class="unselectable">Some extra text: <span class="selectall">ID-12345_678</span></p>
일부 상황에서는 텍스트의 일부를 선택에서 제외하는 것이 적절할 수도 있습니다. 실험적인 user-select
스타일이 그 목적을 위해 사용할 수 있습니다, 그래서 같은 :
.unselectable {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
<span class='unselectable'>Label: </span>some text here
출처
https://stackoverflow.com/questions/39940022