옛날 옛적에 한 남자가 디자인 드래프트를 출판했습니다. 디자인 드래프트를 게시 한 후 그는 DW를 열고 페이지를 끌었습니다. 열심히 일한 후에는 배경을 써야했습니다. 무술가는 "아티스트"라고 불렀습니다.
다음은 HTML5 시맨틱 및 HTML5 시맨틱의 경험 및 분석에 대한 튜토리얼 기사입니다. 이 컨텐츠는이 웹 사이트에서 신중하게 선택하고 편집 한 튜토리얼입니다. 네티즌에게 도움이되기를 바랍니다. 다음은 자세한 내용입니다.
시작 전에 일부 yys옛날 옛적에 한 남자가 디자인 드래프트를 출판했습니다. 디자인 드래프트를 게시 한 후 그는 DW를 열고 페이지를 끌었습니다. 열심히 일한 후에는 배경을 써야했습니다. 무술가는 "아티스트"라고 불렀습니다. 더 어려운 것은 모든 필요가 변할 때 많은 마비를 수정할 수 있다는 것입니다.
그래서 Div+CSS는 인터넷 시대의 단계로 가져 왔으며, 하나 이상의 "div+CSS"해바라기 책이 밤새 태어났습니다. 그 당시 우리는 Div+CSS 시대에 살았고 그 당시에는 그것을 사용했습니다.
그 후, 허리가 아프지 않았고 다리가 아프지 않았으며, 초과 근무를 할 때 더 흥분하게되었습니다.
Yy는 끝나고 주제에 도달하십시오Ghost는 2 년 전 "Page Refactoring의 시맨틱 화"에서 의미론을 설명했으며 Semantic HTML 구조의 이점은 무엇입니까?
재건은 7 년이 걸렸습니다. 아마도 오늘, 우리는 페이지를 능숙하게 쓸 수 있지만 페이지를 잘 작성하는 것이 얼마나 쉬운가요? 아이디어를 정리하고 기본 사항을 검토 한 다음 현재 트렌드와 결합한 다음 의미화 주제에 대해 이야기합시다. Shenma Semanticization입니까? 왜 시맨틱?
재구성의 의미론은 기본적으로 두 부분으로 나눌 수 있습니다. (x) HTML 태그의 의미와 CSS 명명의 의미론.
넌센스 없음 :
(그림 1)
그림 1 비-비-미용사 구현 방법 : no_emantic_html 시맨틱 구현 방법 : emantic_html
당신 말이 맞아요
특별한 취향이 있습니까? 디자인 드래프트를받은 후 수많은 마법 기술이 화면에 실수로 떨어 졌습니까? no_emantic_html이라면 페티쉬를 축하합니다.
합리적인 HTML 태그와 고유 속성을 사용하여 문서 컨텐츠를 형식화합니다. 이것은 Shuke의 시맨틱 태그에 대한 설명이므로 불가능합니다.
HTML이 구조화 된 장소를 사용할 필요는 없습니다. 원래 단어는 분할과 차단을 의미합니다. 일반적으로 (x) HTML의 이전 버전에서 HTML이 구성되는 장소에서만 사용됩니다.
그러나 어떻게 시맨틱 레이블을 쓸 수 있습니까? 기본부터 시작하십시오. 우리가 가장 매일 다루는 것은 Div H1-H6 Ul-Li p와 같은 레이블입니다. 이 레이블에 대한 심층적 인 이해가 있는지 궁금합니다. 아래 표를 살펴 보겠습니다.
| 상표 | 원래 단어 | 설명 | 시맨틱 (Y/N) |
|---|---|---|---|
| H1-H6 | 머리 | HTML 제목을 정의하십시오 | 와이 |
| 피 | 절 | 단락을 정의합니다 | 와이 |
| ul | 순서가없는 목록 | 반대되지 않은 목록을 정의하십시오 | 와이 |
| OL | 주문 목록 | 주문한 목록을 정의합니다 | 와이 |
| 리 | 목록 항목 | 목록을 정의하는 항목 | 와이 |
| DL | 정의 목록 | 정의 정의 목록 | 와이 |
| DT | 정의 용어 | 정의 목록의 항목을 정의하십시오 | 와이 |
| DD | 정의 설명 | 정의 목록의 항목 설명 | 와이 |
| 테이블 | 테이블 | 테이블을 정의하십시오 | 와이 |
| thead | 테이블 헤드 | 테이블에서 헤더의 내용을 정의하십시오 | 와이 |
| tbody | 테이블 바디 | 테이블의 기본 내용을 정의하십시오 | 와이 |
| th | 테이블 헤드 셀 | 테이블에서 헤더 셀을 정의하십시오 | 와이 |
| Tr | 표 행 | 테이블의 행을 정의하십시오 | 와이 |
| TD | 테이블 데이터 셀 | 테이블의 장치를 정의하십시오 | 와이 |
| 에이 | 닻 | 앵커 정의 | 와이 |
| IMG | 영상 | 이미지를 정의하십시오 | 와이 |
| div | 분할 | 문서의 섹션을 정의합니다 | N |
| 기간 | 기간 | 문서의 섹션을 정의합니다 | N |
위는 우리가 일반적으로 사용하는 일부 태그 만 나열합니다. 더 많은 태그는 W3C를 참조하십시오. 기본적으로 모든 HTML 태그는 단어 나 문구의 약어입니다. 이는 실제로 의미론에 대한 이해에 더 편리하다는 것을 의미합니다. 실제로, 모든 (x) HTML 태그를 제외하고
그리고 2 개의 의미가없는 레이블, 다른 레이블에는 그 의미가 있습니다. 어떤 레이블이 있는지 알고 각 레이블의 원래 의미를 이해하면 사용 방법을 알 수 있습니다. 언제 사용 해야하는지 모르겠습니다
모두가 연례 CSS 누드 페스티벌을 알고 있습니까? 선택한 태그가 의미론이 거의없는 경우, 웹 페이지에 스타일 후에는 구조 정보가 거의 없으며 가독성이 매우 열악합니다. 선택한 태그가 의미론에 적합한 경우 웹 페이지는 여전히 DE 스타일 후에도 가독성이 매우 우수합니다. 각 브라우저에는 고유 한 기본 스타일이 있으며 기본 스타일은 각 태그와 다른 디스플레이를 제공합니다. 태그의 정확성은 웹 사이트의 유용성을 반영 할 수 있으며, 이는 웹 사이트의 유용성을 테스트하는 가장 쉬운 방법 중 하나입니다. 모든 사람이 W3C 공식 웹 사이트 태그 사용을 확인하고 웹 개발자를 사용하여 CSS를 비활성화하여 볼 방법을 확인하는 것이 좋습니다. CSS 시맨틱 명명은 이해하기 쉬운 이름으로 HTML 태그에 첨부 된 클래스 또는 ID 이름을 말합니다. 시맨틱 이름 지정에는 팀 이름 지정 사양이 포함됩니다. 팀 사양을 기반으로 한 의미 론적 명명에 의해서만 왕입니다. 내 이해에 따르면, 시맨틱 CSS 명명은 다음과 같은 규칙을 준수해야합니다. Pinyin 이름 지정을 피하고 영어 단어를 사용하여 이름을 지정하십시오. Word를 연결하는 방법에는 밑줄, 스페이서 기호 및 낙타 이름 지정이 있습니다 . 특정 용도로 팀의 사양을 참조하십시오. 그러나 개인적으로 2 개 이상의 연결 방법을 동시에 사용하지 않는 것이 좋습니다. Logo1234와 같은 단어 다음에 의미없는 숫자를 따르지 마십시오 (팀 계약 제외) 과도하게 긴 단어의 이름 지정을 위해서는 약어를 사용할 수 있지만 모든 구성원이이를 이해할 수 있도록해야합니다. 합의 된 단어는 신속하게 이름을 지정하는 데 도움이 될 수 있습니다. 이것이 너무 많아서 여기에 하나씩 나열하지 않습니다. 모르는 단어를 만나면 영어를 추가하십시오! CSS 이름 지정의 의미
头：header内容：content/container尾：footer导航：nav侧栏：sidebar栏目：column登录条：loginbar标志：logo广告：banner轮转：promo页面主体：main热点：hot新闻：news 下载：download子导航：subnav菜单：menu子菜单：submenu搜索：search友情链接：friendlink版权copyright
[1] [2] 다음 페이지