별도의 HTML 요소로 분할된 텍스트 줄의 글꼴 간격 유지

저는 애니메이션을 통해 단어를 개별적으로 배치할 수 있도록 단어를 별도의 HTML 요소로 분할하는 일반적인 기술을 재현하려고 합니다. 내가 겪고 있는 문제는 단어가 별도의 요소로 분리될 때 단어 사이의 간격이 사라진다는 것입니다. 각 단어 뒤에 렌더링하거나 각 요소에 패딩을 추가하여 간격을 추가할 수 있지만 컨테이너에 간격을 수동으로 추가/구부리지 않고 이 작업을 수행할 수 있는 방법이 있는지 알고 싶습니다. 원래 간격을 유지할 수 있나요? ? gsapSplitText와 같은 플러그인이 있다는 것을 알고 있지만

P粉258083432 2023-09-10 18:37:01 0  1  649

테두리 그라디언트는 border-radius와 호환됩니까?

둥근 테두리(테두리 반경)로 입력 상자의 스타일을 지정하고 테두리에 그라데이션 효과를 추가하려고 합니다. 그라데이션과 둥근 테두리를 성공적으로 만들 수 있지만 동시에 둘 다 만들 수는 없습니다. 둥근 모서리가 있지만 그라데이션이 없거나, 그라데이션이 있지만 둥근 모서리가 없습니다. -webkit-border-radius:5px;-webkit-border-image:-webkit-gradient(선형,00,0100%,from(#b0bbc4),to(#ce

P粉824889650 2023-08-21 20:39:38 0  2  486

Bootstrap 행에서 g-5를 초과하는 열 간격에 대한 기본 CSS 스타일을 사용자 정의하는 방법

부트스트랩을 사용하여 간단한 랜딩 페이지를 구축합니다. 행의 열 간격을 늘려야 합니다. 사용자 정의 Sass 간격 믹스인을 사용하여 간격을 늘릴 수 있다는 것을 알고 있지만 제가 만들고 있는 웹 사이트에는 여러 섹션이 포함되어 있으므로 간단하게 유지하고 빌드 프로세스가 필요하지 않습니다. 열 사이에 32px 또는 40px 간격을 제공하는 g-5 클래스 이름을 행에 사용했습니다. CSS를 사용하여 더 늘리는 방법. 행, 행, 행

P粉644981029 2023-08-16 11:02:55 0  1  499

테두리 반경이 있는 그라데이션 테두리 만들기

나는 아래 CSS:a.btn.white-grad{배경:$lgrey;color:#313149!important;border:1pxsolid#000;border-image-source:linear-gradient(toright,#9c20aa,#fb3570) ;국경-이미지-슬라이스:20;float:왼쪽;@include글꼴-크기(

P粉930448030 2023-08-13 16:23:14 0  2  443

그라데이션이 있는 테두리 이미지에 테두리 반경을 사용할 수 있나요?

원형 테두리(테두리 반경)가 있는 입력 필드를 디자인하고 해당 테두리에 그라데이션을 추가하려고 합니다. 그라데이션과 원형 테두리를 성공적으로 만들 수 있지만 둘 다 함께 사용할 수는 없습니다. 그라디언트가 없는 둥근 모서리이거나 그라디언트가 있지만 둥근 모서리가 없는 테두리입니다. -webkit-border-radius:5px;-webkit-border-image:-webkit-gradient(선형,00,0100%,from(#b0bbc4),to(#ced9de))

P粉633733146 2023-08-29 12:52:01 0  2  545

HTML 및 Bootstrap 5를 사용하여 테이블의 행 사이에 공간 만들기

현재 내 콘텐츠가 포함된 테이블이 있지만 각 행 사이에 공백이 있어 명확하게 구분되기를 원하는 것 같습니다. td 요소와 tr 요소의 테두리 간격에 패딩을 사용해 보았습니다. bootstrap5에서 이 작업을 수행하는 가장 쉬운 방법은 무엇입니까? 아래는 내 HTML 및 CSS.icon-green{color:green;}table{border-collapse:separate;border-spacing:015px;}th,td{입니다.

P粉300541798 2024-03-29 15:09:13 0  1  366

CSS - img 태그에 테두리가 있음

img 태그에서 테두리를 어떻게 제거합니까? {코드...} 웹 페이지에 테두리를 넣기 위해 이미지 경로를 사용하지 않았는데, border:0을 사용해도 없앨 수 없었습니다....

PHP中文网 2017-06-12 09:24:40 0  3  961

Safari는 원형 아바타에 대해 CSS를 지원하지 않습니다.

내 블로그는 gatsbyReact 템플릿을 사용하고 있는데 Safari(iPhone 또는 Mac)에서 열면 아바타 이미지가 둥글지 않습니다. 간단한 코드 블로그 이것은 내 아바타에 사용하는 스타일입니다. bio-avatar{margin-right:var(--spacing-4);margin-bottom:var(--spacing-0);min-width:50px;border - 반경:100%;}

P粉779565855 2024-02-17 18:38:55 0  1  467

사용자 에이전트 스타일 시트의 역할 이해

저는 Google Chrome에서 웹페이지 작업을 하고 있습니다. 다음 스타일을 올바르게 표시합니다. table{display:table;border-collapse:separate;border-spacing:2px;border-color:gray;} 이러한 스타일은 제가 정의하지 않았습니다. Chrome 개발자 도구에서는 CSS 파일 이름을 사용자 에이전트 스타일시트로 바꿉니다. 이제 양식을 제출했는데 일부 유효성 검사 오류가 발생하면 다음 스타일시트가 표시됩니다.

P粉277464743 2023-08-27 13:14:56 0  2  573

제목 간격을 정규화하기 위한 동일한 크기의 HTML 요소

일부 요소에는 존재하지만 다른 요소에는 존재하지 않는 html 요소가 있습니다. 존재하지 않는 요소의 경우 동일한 크기의 빈 HTML 요소가 필요합니다. 이렇게 하면 간격이 벗어나지 않게 됩니다. 동일한 요소를 추가하려고 시도했지만 해당 요소를 래핑하는 div에 Hidden, Hidden="hidden" 및 style="visibility:hidden;"을 배치했지만 이로 인해 빌드가 실패했습니다. 어떤 아이디어가 있나요?

P粉722521204 2023-09-13 18:27:42 0  1  522

CSS - 입력과 텍스트 상단 및 하단 중심 사이의 간격

사용 환경: debian8 + firefox-45.8 참조: {code...} 여기에는 두 가지 질문이 있습니다: 1. 제출 시 텍스트는 위쪽 및 아래쪽 중앙에 위치할 수 없습니다. Vertical-align:middle이 설정되어 있으며 "Search"라는 텍스트는 위쪽 및 아래쪽 중앙에 위치할 수 없습니다. 2. 두 입력 사이의 간격에 문제가 있습니다.

漂亮男人 2017-06-20 10:06:57 0  1  1570

고정 헤더와 회전된 열 헤더가 있는 테이블

고정된 헤더와 고정된 첫 번째 열이 있는 테이블이 있습니다. 또한 열 머리글을 45도 회전하고 싶습니다. 고정 제목에는 배경색을 설정해야 합니다. 그러나 다음 열의 배경이 이전 열의 텍스트와 겹치기 때문에 45도 회전된 헤더에 문제가 발생합니다. 다음은 문제의 예입니다. .fixed_table{white-space:nowrap;margin:0;border:none;border-collapse:separate;border-spacing:0;table-layout:

P粉762730205 2024-04-03 08:50:32 0  1  478