본문 바로가기

분류 전체보기155

[CSS] 웹폰트 변환 사이트 https://transfonter.org/ Online @font-face generator The @font-face CSS rule allows web developers to specify online fonts to display text on their web pages. By allowing authors to provide their own fonts, @font-face eliminates the need to depend on the limited number of fonts users have installed on their transfonter.org 2021. 9. 22.
[CSS] 브라우저 접두사/벤더 프리픽스/크로스 브라우징 css 표준 규약이 아닌 속성들은 브라우저에 따라 다른 방식으로 지원되기 때문에 속성 이름 앞에 접두사(prefix)를 붙여 브라우저별로 구분해야 한다. 이를 벤더 프리픽스라고 한다. 표준 규약이 만들어졌더라도 이전 버전의 브라우저 사용자를 고려해 계속 브라우저 접두사를 붙여 사용하기도 한다. 대표적인 예로 transition/transform/border-radius/text-shadow/box-shadow/background:linear-gradient 등이 있다고 하는데.. caniuse로 확인해보면 대부분 표준으로 자리잡은거 같다. 주로 사용하는 브라우저 접두사 접두사 설명 -webkit- 사파리, 크롬 - 웹키트 방식 브라우저용 -moz- 모질라, 파이어폭스 - 게코 방식 브라우저용 -o- 오페.. 2021. 9. 22.
[CSS] 캐스케이딩 스타일 시트 캐스 캐이딩(Cascading) - 위에서 아래로 흐르는 스타일 시트 HTML element는 하나 이상의 스타일에 영향을 받을 수 있다. 그래서 스타일 간의 충돌을 막기 위해 어떤 스타일을 적용 받을지에 대한 우선순위가 결정되어야 한다. 이를 캐스캐이딩이라고 한다. CSS 정식 명칭이 Cascading Style Sheets인 만큼 캐스캐이딩이 중요하다. 캐스캐이딩은 다음의 3가지에 의해 결정된다. Importance(중요도) Specificity(명시도) 코드 순서 Importance(중요도) 1 사용자 스타일 시트 저시력자, 색약자 등과 같이 특별한 조건이 필요한 사용자가 그들에게 맞게 구성해 놓은 스타일 시트. 2 제작자가 만든 스타일 스티 중 !important가 붙은 스타일 3 제작자가 만든 .. 2021. 9. 22.
[HTML] html이란?/html 기본 구조 html이 뭐냐고 물으면... 웹사이트의 구조를 만드는 언어라고밖에 대답못하는 나... 그래서 조금 더 알아보기로했다. HTML이란 무엇일까? HyperText Markup Language, 해석하면 하이퍼텍스트를 마크업하는 언어다. 하이퍼텍스트란? 웹 사이트에서 링크를 클릭해 다른 문서나 사이트로 즉시 이동할 수 있는 기능 마크업이란? 태그를 사용해 문서에서 어느 부분이 제목이고 본문인지, 어느 부분이 사진이고 링크인지 표시하는 것 즉, 웹에서 자유롭게 오갈 수 있는 웹 문서를 만드는 언어가 HTML이라고 정리할 수 있다. HTML 문서 기본 구조 1 - 문서 유형을 지정하는 선언문 웹 브라우저에게 '이제부터 처리할 문서는 HTML 문서이고 어떤 유형을 사용했으니 그 버전에 맞는 방법으로 해석하라' 라.. 2021. 9. 21.
[HTML] <map> 태그, <area> 태그, usemap 속성 - 이미지맵 지정하기 하나의 이미지에 여러 개의 링크를 걸 수 있다. 즉, 한 이미지상에서 클릭 위치에 따라 서로 다른 링크가 열린다. 이것을 '이미지 맵'이라고 한다. 기본형 2021. 9. 21.
[HTML] table 태그 정복하기 , , , 태그 - 기본적인 표 만들기 기본형 제목 내용 표를 나타내는 html 태그 행을 나타내는 과 셀을 나타내는 , 태그 등이 사용됨. - table row - 표 내부에서 행을 나타내는 태그 - table header - header의 cell을 나타내는 태그 - 기본 스타일 : text-align:center, font-weight:bold - table data - 일반적인 칸(cell)을 나타내는 태그 - 기본 스타일 : text-align:left colspan, rowspan 속성 - 행 또는 열 합치기 ※ 이러한 속성들을 적어줄 때 합쳐지는 셀들은 html 상에서 지워줘야 한다. colspan - 가로로 이웃한 셀을 합칠 때 - column이 열이라는 뜻, 열 하나하나를 합치니깐 가로로.. 2021. 9. 21.
반응형

티스토리툴바