html5 - 이 로고는 CSS 스타일을 사용하여 제작되었나요?

Question

이런 댓글을 전달하기 위해 아이콘의 소스 코드를 살펴보니 스타일인 것 같습니다. 그러면 이 스타일은 어떻게 만들어지는 걸까요?

Answer 1

Iconfont가 구현했습니다: http://www.iconfont.cn/

Answer 2

이 웹사이트에서 아이콘을 찾아 CSS 파일을 생성하고 사용할 때 인용해 보세요

Answer 3

실제로는 아이콘 글꼴이 사용됩니다.
웹 페이지에서는 브라우저 시스템에서 사용할 수 없는 글꼴을 설정합니다.
브라우저는 글꼴 파일을 다운로드하고 해당 글꼴을 사용하여 렌더링합니다.

일명 폰트는 문자 인코딩에 해당하는 그래픽입니다

예를 들어 아래 전화 아이콘은 실제로 단어입니다
복사하여 붙여넣기를 선택할 수 있습니다
하지만 환경에 따라 해당 폰트가 다릅니다
표시 형태가 다릅니다 다를 수 있습니다
최악의 경우 설정될 수 있습니다. 폰트에 이 인코딩에 해당하는 그래픽이 없으면 표시되지 않습니다.
☎

자세한 내용은 아이콘폰트 사용법을 참고해주세요

글꼴도 텍스트이고, 크기 조정 왜곡 없이 다른 텍스트 요소에 따라 글꼴 크기, 색상, 장식을 설정할 수 있다는 장점이 있습니다

단점도 뻔한데, 사진이 아니어서 사진처럼 컬러풀한 아이콘을 구현할 수 없습니다

Answer 4

아이콘을 이용하여 구현한 것인데, 구체적인 내용을 말씀드리자면.
1. 먼저 웹사이트에서 아이콘을 선택하고 프로젝트에 저장한 다음 로컬로 다운로드하세요. (여기서 온라인 링크를 사용할 수도 있습니다. 아래 그림은 아이콘 글꼴에서도 두 가지 작업 방법을 보여줍니다.)

2.css(위 그림)에 로컬 또는 온라인 링크를 소개하며, 로컬 방법은 동일합니다.

3. 사용할 스타일에 글꼴군을 아이콘으로 지정하고, 도중에 첫 번째 아이콘을 다시 로드하는 등 아이콘 코드를 사용하세요

으아악

Answer 5

프런트 엔드는 정말 바다를 건너는 여덟 명의 불멸자들과 같으며 각각의 마법의 힘을 보여줍니다. 아이콘 외에도 base64, svg, 심지어 캔버스까지 사용할 수 있습니다

Answer 6

가장 쉬운 방법은 부트스트랩을 사용하는 것입니다
http://v3.bootcss.com/compone...
링크에서 부트스트랩을 소개한 다음 클래스 이름을 라벨에 직접 추가하세요
<button class="btn btn-default "> 전체 화면<span class="glyphicon glyphicon-fullscreen"></span></button>