목록프론트엔드 (7)

Easy ways

[HTML] 이미지 표지 활성화(display)

이미지 표시 활성화 (display)
프론트엔드/Html Css 2023. 8. 25. 00:18
[CSS] 스타일 색상, 폰트 설정 법

CSS 스타일은 부모태그에서 상속된다. CSS는 글자색 배경색 테두리 색등 색상을 표현하기 위한 다양한 방법을 제공하며 red, green과 같이 단어로도 색상 설정이 가능합니다. 단어 리스트 링크 : https://www.w3.org/wiki/CSS/Properties/color/keywords CSS/Properties/color/keywords - W3C Wiki Color keywords Basic Colors Named Numeric Color name Hex rgb Decimal black #000000 0,0,0 silver #C0C0C0 192,192,192 gray #808080 128,128,128 white #FFFFFF 255,255,255 maroon #800000 128,0,0 ..
프론트엔드/Html Css 2023. 8. 25. 00:17
[Html, CSS] 웹페이지 이미지 표현 (margin,padding, border, visibility)

오늘은 Html과 CSS 를 통하여 이미지를 표현하고 조정하는 법을 배워보자 쉽고 간단해서 좋다 단위 웹에서 기본적으로 사용하는 단위는 다음과 같다. px : 픽셀 단위 % : 부모태그의 너비에서의 %단위의 공간의미 auto : 사용자의 브라우저가 자동으로 계산하게 만드는 값 vw,vh : 사용자의 브라우저 창의 해상도를 기준으로 % 계산 [ex) 30vw는 브라우저 화면너비의 30%] vw와 vh를 사용하면 px픽셀과 같이 해상도에 따라 다르게 보이지 않고, 화면의 크기에 상관없이 항상 일정한 비율로 화면에 콘텐츠를 표현할 수 있다. 웹을 스마트폰 등에서도 확인 가능한 반응형으로 짜기 위하여 이러한 방식을 알아 두어야한다. 이미지 크기 지정하기 이미지의 크기는 다음처럼 지정할 수 있다. weight =..
프론트엔드/Html Css 2022. 12. 17. 20:45
[웹 기초] CSS란? CSS의 기초와 예제

저번 HTML 포스팅에 이어서 예쁜 웹페이지를 표현하기 위하여 CSS를 알아봅시다 우선 간단히 말하면, HTML이 웹 화면의 기본 뼈대라면, CSS는 이곳을 꾸며주는 겁니다 CSS란? CSS(Cascading Style Sheets)란 무엇일까요? 우선 의미를 살펴보면, Casecading : 위에서 아래로 흐르는 위에서 아래로 흐르는 스타일 시트입니다. 왜 Casecading 일까요? 우선순위, 또는 가장 마지막에 선언된 스타일로 동작하기 때문입니다. CSS는 HTML 과 함께 쓰이며 웹상에 어떻게 표현할지를 결정하는 역할을 합니다. HTML 이 문서의 서식이라면 CSS는 문서의 디자인인 거죠! CSS는 함수? 같은 느낌인데요 (C언어 개발자의 표현의 한계...😥) 예를 들면, red { 이 태그 뒤에..
프론트엔드/Html Css 2022. 12. 4. 17:51
[HTML] Input Tag 총 정리

오늘 포스트에서는 HTML에서 사용하는 Input TAG에 대해서 좀 더 자세하게 다뤄보겠습니다 인터넷에 정리가 잘되어있는 자료들이 많긴 하지만ㅎㅎ 정리하는 개념으로 한 번 접근해 보겠습니다. INPUT TAG 기본 구성 ID input 창에 ID를 부여합니다. 이는 이후에 자바 스크립트 등과 연동할 때 사용합니다. Vlaue input 창안에 무슨 내용을 써둘지 input tag의 value 기본 값을 말합니다. Type input 태그 안에 들어갈 데이터의 타입 선정 이를 통해서 기본적인 타입 에러 발생을 방지할 수 있습니다. 예를들면 전화번호에 문자 타입이 들어가는걸 방지하는 거죠 이 타입이 좀 다양하게 있는데요 상세하게 한 번 확인해보겠습니다. HTML INPUT TAG Type 종류 요약 Typ..
프론트엔드/Html Css 2022. 11. 17. 11:46
[웹서버 기초]HTML 이란? (개념설명, 환경구축, 예제)

요즘 코딩에 대한 관심도가 어마어마하죠 특히, 휴대폰을 통해서 일상과 가장 밀접하게 엮여있는 앱, 웹에 대한 관심이 커지고 있는 것 같습니다. 그래서, 이번엔 간단한 웹서버를 구축하는 포스트를 쭉 작성해 볼까 합니다 처음은 어떤 걸로 할까 고민하다가 요즘에는 직접은 잘 안 쓴다고는 하지만, 필수적으로 알아야 할 항목이죠. HTML에 대해 알아보겠습니다. HTML(Hyper Text Markup Language) 이란? HTML,.. Hyper Text Markup Language 은 무슨 의미 일까요? 직역을 하자면,.... 과도한 글 가격 인상 언어?... 이게 무슨 말인가 싶네요 저도 의미가 궁금해져 위키피디아를 한번 찾아봤는데요 Hyper Text : 전자 장치 등에 사용자가 바로 볼 수 있는 표시..
프론트엔드/Html Css 2022. 9. 23. 17:24
자주쓰는 HTML 태그 종류

오늘은 HTML 태그 종류에 대해서 정리해보려 합니다. 딱히 외울 필요가 없다고 생각해서 매번 찾으려니 힘드네요 ㅎㅎ 그래서 제가 보려고! 한번 쭉 정리하려 합니다. 이 포스트는 지속적으로 업데이트가 될 것 같네요ㅎㅎ HTML TAG 란? 태그는 HTML 에서 정보를 표기하고, 정보의 형태등을 결정짓는 등의 역할을 합니다. 태그를 해독하는 존재는 크롬과 같은 브라우저 입니다. 이런 예약된 언어들을 브라우저에서 다르게 해독한다면 원했던 결과와 다른 결과를 표출되는 경우도 있다고 합니다. 자주쓰는 TAG 이름 기능 활용 예시 Html 코드임을 표현 콘텐츠 그릇 (줄 바꿈 O) 콘텐츠 콘텐츠 그릇 (줄 바꿈 X) 콘텐츠 하이퍼링크 콘텐츠 외부 파일을 HTML 문서와 연결 < link rel = "style.c..
프론트엔드/Html Css 2022. 9. 22. 19:09
Prev 1 Next