반응형

CSS 6

입력 옆의 형태로 레이블 정렬

입력 옆의 형태로 레이블 정렬 저는 입력 옆에 레이블을 정확하게 정렬해야 하는 매우 기본적이고 알려진 형태의 시나리오를 가지고 있습니다.하지만 나는 그것을 어떻게 하는지. 제 목표는 오른쪽 입력 옆에 레이블을 정렬하는 것입니다.여기 원하는 결과의 그림 예시가 있습니다. 저는 여러분의 편의를 위해 그리고 제가 지금 가지고 있는 것을 분명히 하기 위해 만지작거렸습니다 - http://jsfiddle.net/WX58z/ . 스니펫: Simple label Label with more text Short 경고: 시대에 뒤떨어진 답변 요즘에는 반드시 고정 폭을 사용하는 것을 피해야 합니다.플렉스박스나 CSS 그리드를 사용하여 대응 가능한 솔루션을 제안할 수 있습니다.다른 답을 보세요. 한 가지 가능한 해결책: 라..

programing 2023.09.12

CSS로 배경 이미지에 크기를 설정하시겠습니까?

CSS로 배경 이미지에 크기를 설정하시겠습니까? CSS로 배경 이미지의 크기를 설정할 수 있습니까? 나는 다음과 같은 일을 하고 싶습니다. background: url('bg.gif') top repeat-y; background-size: 490px; 하지만 그렇게 하는 것은 완전히 잘못된 것 같습니다.CSS2 이미지를 크게 만들어야 하는 경우 이미지 편집기에서 이미지 자체를 편집해야 합니다. img 태그를 사용하면 크기를 변경할 수 있지만 이미지가 다른 컨텐츠의 배경이 되어야 하는 경우 원하는 결과를 제공하지 않습니다(원하는 것처럼 반복되지 않습니다). CSS3 unleash the powers 이것은 CSS3에서 가능합니다.background-size. 모든 최신 브라우저가 이를 지원하므로 오래된 ..

programing 2023.09.07

부트스트랩 팝업 폭 변경

부트스트랩 팝업 폭 변경 저는 부트스트랩 3을 이용하여 페이지를 디자인하고 있습니다.저는 팝오버를 같이 사용하려고 합니다.placement: right입력 요소에새로운 부트스트랩은 다음과 같은 기능을 제공합니다.form-control기본적으로 전폭 입력 요소가 있습니다. HTML 코드는 다음과 같습니다. Name: 팝오버 폭이 너무 낮은 것 같아요. 왜냐하면 디브에 남아있는 폭이 아니기 때문입니다.저는 왼쪽에 입력 양식을, 오른쪽에 넓은 팝업을 원합니다. 주로 부트스트랩을 무시할 필요가 없는 해결책을 찾고 있습니다. 첨부된 JSFiddle.두 번째 입력 옵션.jsfiddle을 많이 사용하지 않아서 잘 모르겠지만 출력 상자의 크기를 늘려보면 결과를 볼 수 있습니다. 작은 화면에서는 볼 수도 없습니다.htt..

programing 2023.09.07

입력 상자에 부트스트랩 글리폰 추가

입력 상자에 부트스트랩 글리폰 추가 텍스트 유형 입력란에 글리폰을 추가하려면 어떻게 해야 합니까?예를 들어, 다음과 같은 사용자 이름 입력에 'icon-user'를 입력하고 싶습니다. 부트스트랩 미포함: 잠시 후에 부트스트랩을 시작할 예정이지만, 이 작업을 직접 수행하기 위한 기본 CSS 개념이 여기에 있습니다.먹잇감의 수염이 지적하는 것처럼 입력 요소 안에 아이콘을 절대적으로 배치하여 CSS로 이를 수행할 수 있습니다.그런 다음 텍스트가 아이콘과 겹치지 않도록 양쪽에 패딩을 추가합니다. 따라서 다음 HTML의 경우: 다음 CSS를 사용하여 왼쪽과 오른쪽 정렬 글리프를 정렬할 수 있습니다. /* enable absolute positioning */ .inner-addon { position: relat..

programing 2023.09.07

디브에서 긴 단어를 단어로 묶는 방법이 있습니까?

디브에서 긴 단어를 단어로 묶는 방법이 있습니까? Internet Explorer가 단어 랩 스타일이 있는 것은 알고 있지만, div에서 텍스트를 생성하는 크로스 브라우저 방식이 있는지 알고 싶습니다. CSS를 원하지만 자바스크립트 스니펫도 잘 작동할 것입니다. 긴 줄을 말씀드리는 겁니다.원문을 읽으며 러더퍼드는 끊기지 않은 텍스트를 랩핑하는 크로스 브라우저 방법을 찾고 있습니다. (IE용 워드랩을 사용한 것에서 유추할 수 있으며, 끊기지 않은 문자열을 끊도록 설계되었습니다. /* Source: http://snipplr.com/view/10979/css-cross-browser-word-wrap */ .wordwrap { white-space: pre-wrap; /* CSS3 */ white-space..

programing 2023.09.07

HTML 전자 메일 스타일 설정 모범 사례

HTML 전자 메일 스타일 설정 모범 사례 닫힘.이 질문은 더 필요합니다.집중적인현재 답변을 수락하고 있지 않습니다. 이 질문을 개선하고 싶으십니까?이 게시물을 편집하여 하나의 문제에만 초점을 맞추도록 질문을 업데이트합니다. 9년 전에 문을 닫았습니다. 이 질문을 개선합니다. 저는 이메일 뉴스레터의 HTML 템플릿을 디자인하고 있습니다.저는 많은 이메일 고객들이 링크된 스타일시트를 무시하고, 다른 많은 고객들(Gmail 포함)은 CSS 블록 선언을 완전히 무시한다는 것을 배웠습니다.인라인 스타일 속성이 유일한 선택입니까?HTML 전자 메일을 스타일링하는 가장 좋은 방법은 무엇입니까?저는 전에 HTML 이메일 배틀을 해본 적이 있습니다.다음은 이메일 클라이언트 간의 호환성을 극대화하기 위한 스타일링에 대한..

programing 2023.09.02
반응형