본문 바로가기

Lect & Tip/html, css, scss24

word-break:break-all HTML 테이블에서 자동 줄 바꿈, 넓이 지정 방법!! word-break:break-all HTML 테이블에서 자동 줄 바꿈, 넓이 지정 방법!!블로그 포스팅을 하며 테이블의 크기 때문에 고민되신적 있으시죠? 내가 원하는 테이블의 크기는 딱 요 정도인데, 칼럼(TD) 안에 입력한 글자에 따라 테이블 크기가 마음대로 변경되어 버리면 참 속상합니다. 오늘은 내가 사용하고자 하는 크기에 맞게 이쁜 테이블을 구성하는 방법에 대해 살펴보겠습니다.먼저, 예제 테이블을 통해 기본 설정을 확인해보겠습니다. 두 개의 TD 값을 가지며 각각의 너비를 150px로 지정한 테이블을 만들어보겠습니다. 12345 12345 1234512345이렇게 하면, 테이블 안에 아무런 내용이 없거나 지정한 사이즈보다 길이가 작은 문자열이 입력된다면, 내가.. 2024. 10. 26.

구글 BlogSpot title 블로그타이틀+페이지타이틀 SEO 변경, google blogger 테마 html 편집 방법 Google BlogSpot의 블로그 타이틀과 페이지 타이틀을 SEO 최적화하는 방법 구글의 블로그 플랫폼 중 하나인 BlogSpot은 많은 블로거들에게 인기 있는 선택지입니다. 그러나 가끔씩 태그에 블로그 타이틀과 페이지 타이틀이 함께 표시되는 경우가 있습니다. 이는 SEO 측면에서 바람직하지 않을 수 있습니다. 이 글에서는 이 문제를 해결하고자 하는 블로거들을 위해 Google Blogger의 테마 HTML을 편집하는 방법을 제시하겠습니다. 타이틀 수정 방법 구글 BlogSpot을 이용하다보면, 태그의 내용에 임의로 "블로그타이틀+페이지타이틀"이 들어가는 경우가 생길 수 있습니다. 이는 블로그의 SEO에 부정적인 영향을 미칠 수 있습니다. 이런 상황을 해결하기 위해서는 다음과 같은 단계를 따르면 됩니.. 2024. 3. 23.

CSS 텍스트 네온사인 만드는 방법 CSS 텍스트 네온사인 만드는 방법 네온 텍스트는 웹 사이트에 멋진 미래적인 느낌을 추가할 수 있습니다. CSS와 애니메이션을 활용하면 다양한 방법으로 텍스트에 빛나는 효과를 적용할 수 있습니다. 이 포스팅에서는 CSS 텍스트 네온사인 만드는 방법을 소개하고자 합니다. 텍스트에 글로우 효과 추가 먼저 텍스트에 글로우(빛나는) 효과를 추가하는 방법부터 알아보겠습니다. 이를 위해서는 CSS의 text-shadow 속성을 사용합니다. 다음과 같이 CSS를 작성하여 글로우 효과를 만들 수 있습니다. .neonText { color: #fff; text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #0fa, 0 0 82px #0fa, 0 0 92px.. 2023. 10. 7.

썸네일 이미지 비율 유지 영역에 꽉 차게 이미지 자르기 한 후 가운데 정렬 CSS 및 jquery 가로세로 비율 ✈ 썸네일 이미지 비율 유지 영역에 꽉 차게 이미지 자르기 한 후 가운데 정렬 CSS 및 jQuery 가로세로 비율 웹사이트나 애플리케이션을 제작하면서 이미지의 비율이나 크기를 맞추는 것은 중요한 작업 중 하나입니다. 특히, 썸네일이나 대표 이미지와 같은 고정된 영역에 다양한 크기와 비율의 이미지를 표시해야 할 때, 그 이미지를 영역에 꽉 차게 보여주면서도 넘치는 부분을 잘라내야 할 필요가 있습니다. 이미지의 가로와 세로 비율을 고정된 영역에 맞추려면, 서버에서 이미지를 잘라내거나 리사이징하는 방법이 있습니다. 하지만 이 방법은 원본 이미지의 품질을 손상시킬 수 있기 때문에, CSS나 jQuery를 활용하여 원본 이미지를 그대로 유지하면서도 원하는 비율에 맞게 보여주는 방법을 찾아야 합니다. CSS를 활.. 2023. 10. 6.

[browser] 브라우저 렌더링 과정, css html javasccript parsing process 인터넷 주소창에 URL을 입력했을 때, 사용자가 웹 페이지를 보기까지 거치는 과정은 다음과 같습니다: 사용자가 웹 브라우저의 주소창에 URL을 입력합니다. 브라우저는 입력된 URL을 기반으로 서버의 IP 주소를 찾기 위해 DNS(Domain Name System)에게 DNS 조회 요청을 합니다. DNS는 도메인 이름을 IP 주소로 매핑해 주는 역할을 합니다. DNS는 도메인 이름을 IP 주소로 변환하여 브라우저에게 응답합니다. 브라우저는 해당 IP 주소로 서버에 HTTP 요청을 보냅니다. 이 요청은 HTTP 프로토콜을 따라 구성되며, 요청 메서드(GET, POST 등)와 헤더(요청의 추가 정보)를 포함합니다. 서버는 요청을 받고 해당하는 리소스(HTML, CSS, JavaScript 파일 등)를 찾아서 .. 2023. 7. 6.

CSS로 네온 텍스트를 만드는 방법 ✈네온 텍스트는 모든 웹 사이트에 멋지고 미래적인 느낌을 더할 수 있습니다. 저는 항상 네온사인의 마법을 좋아했고 CSS를 사용하여 다시 만들고 싶었습니다. 나는 그것을 하는 방법에 대한 몇 가지 팁을 공유할 것이라고 생각했습니다! 이 기사에서는 텍스트에 빛나는 효과를 추가하는 방법을 살펴보겠습니다. 또한 CSS와 키 프레임을 사용하여 네온사인에 다양한 방법을 살펴보겠습니다. 다음은 우리가 만들 것입니다. 텍스트에 글로우 효과 추가 먼저 텍스트를 빛나게 만들어 보겠습니다. text-shadow속성을 사용하여 CSS에서 수행할 수 있습니다.깔끔한 점 text-shadow은 쉼표로 구분하여 여러 그림자를 적용할 수 있다는 것입니다. .neonText { color: #fff; text-shadow: 0 0 .. 2021. 5. 6.

이전 1 2 3 4 다음

티스토리툴바