ko: add translation for selectors/type_class_and_id_selectors
#14599
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Preview URLs Flaws (107)URL:
(comment last updated: 2023-07-31 13:53:54) |
yechoi42
requested changes
Jul 31, 2023
Comment on lines
25
to
29
| >에 대한 기본 지식, HTML 기초 ( | ||
| <a href="/ko/docs/Learn/HTML/Introduction_to_HTML" | ||
| >HTML 소개</a | ||
| > 공부), CSS 작동 방식에 대한 아이디어 ( | ||
| <a href="/ko/docs/Learn/CSS/First_steps">CSS 첫 단계</a>공부.) |
There was a problem hiding this comment.
Suggested change
| >에 대한 기본 지식, HTML 기초 ( | |
| <a href="/ko/docs/Learn/HTML/Introduction_to_HTML" | |
| >HTML 소개</a | |
| > 공부), CSS 작동 방식에 대한 아이디어 ( | |
| <a href="/ko/docs/Learn/CSS/First_steps">CSS 첫 단계</a>공부.) | |
| >에 대한 기본 지식, HTML 기초( | |
| <a href="/ko/docs/Learn/HTML/Introduction_to_HTML" | |
| >HTML 소개</a | |
| >를 공부하세요), CSS 작동 방식에 대한 아이디어( | |
| <a href="/ko/docs/Learn/CSS/First_steps">CSS 첫 단계</a>를 공부하세요) |
study가 명령문이어서 어조를 바꾸었습니다. 띄어쓰기도 수정하였습니다.
Comment on lines
50
to
51
|
|
||
| The universal selector is indicated by an asterisk (`*`). It selects everything in the document (or inside the parent element if it is being chained together with another element and a descendant combinator). In the following example, we use the universal selector to remove the margins on all elements. Instead of the default styling added by the browser — which spaces out headings and paragraphs with margins — everything is close together. |
There was a problem hiding this comment.
Suggested change
| The universal selector is indicated by an asterisk (`*`). It selects everything in the document (or inside the parent element if it is being chained together with another element and a descendant combinator). In the following example, we use the universal selector to remove the margins on all elements. Instead of the default styling added by the browser — which spaces out headings and paragraphs with margins — everything is close together. |
번역문만 남겨주세요.
|
|
||
| The universal selector is indicated by an asterisk (`*`). It selects everything in the document (or inside the parent element if it is being chained together with another element and a descendant combinator). In the following example, we use the universal selector to remove the margins on all elements. Instead of the default styling added by the browser — which spaces out headings and paragraphs with margins — everything is close together. | ||
|
|
||
| 범용 선택기는 별표(`*`)로 표시됩니다. 문서의 모든 항목을 선택합니다(또는 다른 요소 및 하위 연결자와 함께 연결된 경우 상위 요소 내부). 다음 예제에서는 범용 선택기를 사용하여 모든 요소의 여백을 제거합니다. 여백이 있는 제목과 단락의 간격을 두는 브라우저에서 추가한 기본 스타일 대신 모든 것이 서로 가깝습니다. |
There was a problem hiding this comment.
Suggested change
| 범용 선택기는 별표(`*`)로 표시됩니다. 문서의 모든 항목을 선택합니다(또는 다른 요소 및 하위 연결자와 함께 연결된 경우 상위 요소 내부). 다음 예제에서는 범용 선택기를 사용하여 모든 요소의 여백을 제거합니다. 여백이 있는 제목과 단락의 간격을 두는 브라우저에서 추가한 기본 스타일 대신 모든 것이 서로 가깝습니다. | |
| 범용 선택기는 별표(`*`)로 표시됩니다. 문서의 모든 항목을 선택합니다(또는 다른 요소 및 하위 연결자와 함께 연결된 경우 상위 요소 내부). 다음 예제에서는 범용 선택기를 사용하여 모든 요소의 여백을 제거합니다. 브라우저에서 추가한 기본 스타일이 제목과 단락의 간격을 두는 것과 반면, 모든 것이 서로 가깝습니다. |
'기본 스타일'에 수식 문구('간격을 두는~' ' 브라우저에서 추가한~'가) 많아 한번에 읽히지 않는 것 같습니다. 보다 잘 읽히도록 수정해보았습니다.
There was a problem hiding this comment.
이전보다 읽기 좋아진 거 같습니다.
이 부분에 대한 고민은 번역시점에는 해보지 못했었는데, 피드백 주셔서 감사합니다!
Comment on lines
71
to
72
| To avoid this confusion, we can add the universal selector to the `:first-child` pseudo-class, so it is more obvious what the selector is doing. It is selecting _any_ element which is the first-child of an `<article>` element, or the first-child of any descendant element of `<article>`: | ||
|
|
There was a problem hiding this comment.
Suggested change
| To avoid this confusion, we can add the universal selector to the `:first-child` pseudo-class, so it is more obvious what the selector is doing. It is selecting _any_ element which is the first-child of an `<article>` element, or the first-child of any descendant element of `<article>`: |
|
|
||
| To avoid this confusion, we can add the universal selector to the `:first-child` pseudo-class, so it is more obvious what the selector is doing. It is selecting _any_ element which is the first-child of an `<article>` element, or the first-child of any descendant element of `<article>`: | ||
|
|
||
| 이러한 혼란을 피하기 위해 `:first-child` 의사 클래스에 범용 선택자를 추가할 수 있으므로 선택자가 수행하는 작업이 더 명확해집니다. `<article>` 요소의 첫 번째 자식 또는 `<article>`의 모든 하위 요소의 첫 번째 자식인 _any_ 요소를 선택합니다. |
There was a problem hiding this comment.
Suggested change
| 이러한 혼란을 피하기 위해 `:first-child` 의사 클래스에 범용 선택자를 추가할 수 있으므로 선택자가 수행하는 작업이 더 명확해집니다. `<article>` 요소의 첫 번째 자식 또는 `<article>`의 모든 하위 요소의 첫 번째 자식인 _any_ 요소를 선택합니다. | |
| 이러한 혼란을 피하기 위해 `:first-child` 의사 클래스에 범용 선택자를 추가할 수 있으므로 선택자가 수행하는 작업이 더 명확해집니다. `<article>` 요소의 첫 번째 자식인 어떤 요소 또는 `<article>`의 모든 하위 요소의 첫 번째 자식인 어떤 요소를 선택합니다. |
any가 두 번 나오는데요, any에 대한 번역을 추가하고 수정했습니다.
Comment on lines
84
to
85
|
|
||
| The class selector starts with a dot (`.`) character. It will select everything in the document with that class applied to it. In the live example below we have created a class called `highlight`, and have applied it to several places in my document. All of the elements that have the class applied are highlighted. |
There was a problem hiding this comment.
Suggested change
| The class selector starts with a dot (`.`) character. It will select everything in the document with that class applied to it. In the live example below we have created a class called `highlight`, and have applied it to several places in my document. All of the elements that have the class applied are highlighted. |
|
|
||
| ### 특정 요소에 대한 타켓팅 클래스 | ||
|
|
||
| 클래스가 적용된 특정 요소를 대상으로 하는 선택자를 만들 수 있습니다. 다음 예에서는, `highlight` 클래스가 있는 `<h1>` 제목과 다르게 `highlight` 클래스가 있는 `<span>`을 강조 표시하니다. 대상으로 지정하려는 요소의 유형 선택자를 사용하고 ,사이에 공백 없이 점을 사용하여 추가된 클래스를 사용하여 이 작업을 수행합니다. |
There was a problem hiding this comment.
Suggested change
| 클래스가 적용된 특정 요소를 대상으로 하는 선택자를 만들 수 있습니다. 다음 예에서는, `highlight` 클래스가 있는 `<h1>` 제목과 다르게 `highlight` 클래스가 있는 `<span>`을 강조 표시하니다. 대상으로 지정하려는 요소의 유형 선택자를 사용하고 ,사이에 공백 없이 점을 사용하여 추가된 클래스를 사용하여 이 작업을 수행합니다. | |
| 클래스가 적용된 특정 요소를 대상으로 하는 선택자를 만들 수 있습니다. 다음 예에서는, `highlight` 클래스가 있는 `<h1>` 제목과 다르게 `highlight` 클래스가 있는 `<span>`을 강조 표시합니다. 대상으로 지정하려는 요소의 유형 선택자를 사용하고, 사이에 공백 없이 점을 사용하여 추가된 클래스를 사용하여 이 작업을 수행합니다. |
|
|
||
| 요소에 여러 클래스를 적용하고 개별적으로 대상을 지정하거나 선택자의 모든 클래스가 있는 경우에만 요소를 선택할 수 있습니다. 이는 사이트에서 다양한 방식으로 결합할 수 있는 컴포넌트를 구축할 때 유용할 수 있습니다. | ||
|
|
||
| 아래 예시에는, 메모가 포함된 `<div>`가 있습니다. 상자에 `notebox` 클래스가 있는 경우 회색 테두리가 적용됩니다. `경고` 또는 `위험` 클래스도 있는 경우 {{cssxref("border-color")}}를 변경합니다. |
There was a problem hiding this comment.
Suggested change
| 아래 예시에는, 메모가 포함된 `<div>`가 있습니다. 상자에 `notebox` 클래스가 있는 경우 회색 테두리가 적용됩니다. `경고` 또는 `위험` 클래스도 있는 경우 {{cssxref("border-color")}}를 변경합니다. | |
| 아래 예시에는, 메모가 포함된 `<div>`가 있습니다. 상자에 `notebox` 클래스가 있는 경우 회색 테두리가 적용됩니다. `warning` 또는 `danger` 클래스도 있는 경우 {{cssxref("border-color")}}를 변경합니다. |
클래스 이름이니 번역하지 않는 것이 좋습니다.
|
안녕하세요! @yechoi42 님. |
IMHOJEONG
changed the title
selectors/type_class_and_id_selectors
IMHOJEONG
changed the title
selectors/type_class_and_id_selectorsselectors/type_class_and_id_selectors
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
css의 기본인 type, class, id 선택자에 대해서 번역해보았습니다.
Motivation
다른 부분들은 어느 정도 번역이 되어 있는데, css 부분에만 아직 번역이 덜 되어 있는 거 같고 좋은 정보를 공유하고자 하는 마음에 번역하게 되었습니다.
Additional details
Related issues and pull requests