션냥의 개발일지

안녕하세요 오늘은 css에서 뺄 수 없는 레이아웃에 대해 알아볼게요!Layout에 대한 개념은 현업에서도 많이 쓰기에 꼼꼼히 다뤄보겠습니다그럼 바로 시작할게요 🚀🚀블록 레벨 태그와 인라인 레벨 태그지난 번에도 한 번 말했었던 개념인데 기억나시나요?블록 태그는 한 줄을 다 차지하고 인라인은 내용만큼만 차지한다고 했었죠.이에 대해 조금 더 자세히 알아볼게요.블록 레벨 태그태그를 추가했을 때 브라우저의 한 줄을 다 차지해요.그렇기 때문에 좌우에 다른 태그를 배치할 수 없습니다.또한, 블록태그는 width, height, margin, padding 등 크기나 위치를 지정할 수 있어요.p, div, h1~h6, ul, ol, blockquote, form, hr, table, fieldset, ...등이 ..

안녕하세요 저번에 양 조절 실패 이슈로..끝내지 못한텍스트 관련 스타일을 마저 살펴보겠습니다.🚀🚀✏️text-decoration텍스트에 밑줄이나 취소선을 그어주는 스타일 속성지정가능한 속성 값underline: 밑줄을 그어줌.overline: 윗줄을 그어줌.line-through: 취소선을 그어줌.none: 기본값. 아무 선도 표시하지 않음.➡️direction글자의 쓰기 방향을 지정하는 속성지정가능한 속성 값ltr(left to right): 왼쪽에서 오른쪽으로 텍스트 표시. 기본값.rtl(right to left): 오른쪽에서 왼쪽으로 텍스트 표시.↘️text-align문단의 텍스트 정렬 방법을 지정하는 속성지정가능한 속성 값start: 텍스트를 줄의 시작위치에 맞춰서 정렬end: 텍스트를 줄의 ..

안녕하세요, 개발자 여러분! ✨오늘부터 프론트엔드의 시작인 html에 대해 작성하려고 합니다. 🎉html에 대해 알기 전에, 프론트엔드에 대한 전체적인 틀을 잡고나서 공부를 시작하시면 훨씬 좋다고 생각해요그래서 먼저, 프론트 엔드의 전반적인 내용에 대해 설명하며 시작해 보려고 합니다!웹 개발이 프론트엔드와 백엔드로 나뉘어져 있다는 건 전에 말씀드렸죠?간단히, 프론트엔드는 사용자의 눈에 보이는 것, 그리고 백엔드는 그 뒤에서 데이터들이 돌아가는 것이였죠그 중 프론트엔드는 아래와 같이 나뉘어져요. 🕸️프론트엔드의 구성요소 📚프론트엔드는 크게 HTML, CSS, JavaScript로 나눌 수 있습니다.HTML: 웹사이트의 기본 뼈대를 구성합니다.CSS: 디자인 요소를 추가합니다.JavaScript: 동적..

웹 개발의 첫걸음: 프론트엔드와 백엔드 이해하기 😊안녕하세요! 기록용으로 항상 배운것들을 정리하고 있었지만,이렇게 공개적인 곳에 기록을 남기는 것이 더 의미있을 것 같아서오늘부터 함께 웹 개발의 기초부터 기록해나가려 합니다!웹 개발이란, 우리가 일상에서 자주 접하는 웹 페이지를 만드는 과정이에요.이번 포스트에서는 웹 개발의 기본 구조와 개념에 대해 설명해드릴게요.웹 페이지의 구조 🌐웹 페이지는 크게 두 부분으로 나뉩니다: 프론트엔드와 백엔드.프론트엔드 🖥️프론트엔드는 사용자가 직접 볼 수 있는 웹 페이지의 부분입니다.우리가 볼 수 있는 웹 페이지의 모든 부분이 여기에 속하죠개념적으로는 디자인, 레이아웃, 사용자 인터페이스 등이 여기에 속해요.사용자 경험(UX)을 향상시키는 모든 요소가 포함됩니다.백..