[JavaScript] 자바스크립트(JavaScript)에서 style.textAlign 적용하기

 

HTML에서 <style> 태그를 사용하거나, 태그 안에 style을 먹이는 방법 말고, 스크립트 단에서 style을 적용할 수도 있다. 이 때, textAlign도 적용시킬 수 있는데, style.textAlign을 사용하면 된다.

---

자바스크립트(JavaScript)에서 style.textAlign 적용하기

스크립트 단에서 document.createElement를 통해 div를 생성하고, 해당 요소에 아래와 같이 스타일을 적용할 수 있다.

<script>
    // 툴팁 요소 생성
    this.tooltip = document.createElement('div');
    this.tooltip.style.position = 'absolute';
    this.tooltip.style.backgroundColor = 'rgba(0,0,0,0.8)';
    this.tooltip.style.color = 'white';
    this.tooltip.style.padding = '5px';
    this.tooltip.style.borderRadius = '5px';
    this.tooltip.style.display = 'none';
    this.tooltip.style.zIndex = '1000';
    this.tooltip.style.textAlign = 'left';
    document.body.appendChild(this.tooltip);
    console.log("Tooltip created:", this.tooltip);
</script>

 

 

물론, 위의 script 단에서 css를 적용할 수 있지만, tooltip 요소에 id를 부여하여 따로 <style> 태그 안에서 적용할 수도 있다.