IT개발/HTML & CSS 관련14 [Figma] 피그마 AutoHTML 플러그인 과거 웹퍼블리셔로 실무경험을 했을때 디자이너와 협업 과정에서 Photoshop, Sketch, Zeplin 을 주로 사용했던것 같은데, 요즘에는 Figma가 대세인것 같다.IT 분야로 다시 도전하는 가운데 Figma도 좀 알고 있어야할 것 같아서 이런 저런 영상을 보며 알아보는데 Dev 모드라고 해서 디자인을 코드로 변환해주는 좋은 기능이 있는걸 발견했다.그런데 문제는 언제부터인가 그게 유료화가 된 것 같다. 이제 입문자로 테스트 삼아 공부하는 가운데 유료결제를 하고싶지 않아 그냥 있었는데, 좀 더 찾아보니 기능이 좀 더 단순하지만 무료로 활용할 수 있는 AutoHTML 플러그인이 있다는 것을 알게 되었다. https://autohtml.dev/ AutoHTML | Figma PluginWrite you.. 2025. 2. 18. HTML - 목록태그(ol, ul, dl) ul(Unordered List) 태그 : 목록에 불릿(기호)을 제공하여 출력하기 위한 태그ol(ordered List) 태그 : 목록에 순서값을 제공하여 출력하기 위한 태그li 태그 : 목록을 출력하기 위한 태그→ ol 태그 또는 ul 태그의 하위태그(자식태그)로만 사용 가능 li 태그 ol 태그 또는 ul 태그의 하위태그(자식태그)로만 사용 가능 --> 유채방 도미토리, 동성(또는 가족) 1팀 4인실 공동 취사실 및 욕실 비용 비수기 : 1인 20,000원 성수기 : 1인 25,000원 도미토리, 동성(또는 가족) 1팀 4인실 공동 취사실 및 욕실 비용 비수기 : 1인 20,000원 .. 2024. 6. 26. HTML - img 태그(웹개발/마크업/클라이언트/이미지) img 태그 : 웹서버에 저장된 이미지 파일을 제공받아 이미지를 출력하기 위한 태그→ 웹(Web)에서 사용하는 이미지 파일 : GIF 파일, PNG 파일, JPEG 파일 등→ alt 속성 : 출력될 이미지에 대한 설명을 속성값으로 설정 - 음성 지원 → src 속성 : 출력될 이미지 파일의 URL 주소를 속성값으로 설정(src 속성값으로 설정된 이미지 파일이 없는 경우 404 상태코드가 전달되어 이미지는 출력되지 않는다.)→ width 속성의 속성값을 사용해 출력될 이미지의 폭 변경 가능 - 이미지 높이는 비율에 따라 자동 변경된다.HTML 문서와 동일한 서버에 존재하는 웹자원(WebContext)은 URL 주소에서 서버 접속 관련 정보를 생략하여 작성 가능하다. - 프로토콜, 서버명(IP 주소), 포트.. 2024. 6. 26. HTML 기본 내용(http 프로토콜 / 웹서버 / WAS / 클라이언트 / 웹개발 / 이클립스) HTML(Hyper Text Markup Language) : 태그(Tag)를 사용하여 웹문서를 구조적으로 표현하기 위한 언어→ 브라우저 엔진에 의해 해석되어 실행(출력)되는 언어 - 출력 전용 언어CSL(Client Script Language) : 클라이언트에서 해석되어 실행되는 언어 - HTML, CSS, Javascript태그를 사용하여 웹문서(HTML 문서) 작성 - 태그는 대소문자를 구분하지 않는다.시작태그와 종료태그가 하나의 그룹으로 묶여져서 사용된다. - HTML 태그중에는 독립 태그도 존재한다.시작태그와 종료태그 안에는 하위태그(자식태그) 또는 태그내용을 작성하면 된다.시작태그에는 속성과 속성값을 사용하여 태그를 다양하게 표현할 수 있다.→ 태그에는 동일한 이름의 속성 사용이 불가능하다... 2024. 6. 25. 웹퍼블리셔를 위한 기본 배경정보(2) ※ 아래 내용은 개인적인 기록목적으로 정리해둔 내용이고, 정보의 출처를 일일히 확인하지 못하였습니다. [시멘틱태그] -시멘틱: 의미론적인(HTML5 태그의 가장 큰 변화 중 하나) 검색엔진이나 그 이외의 기계적인 동작들이 웹페이지를 쉽게 이해할 수 있게 하는데 의미가 있음 [aside 의미, 사용처] The tag defines some content aside from the content it is placed in. The aside content should be related to the surrounding content. aside 태그는 주요한 내용이 아니라 부차적인 내용을 담는 태그. aside 태그는, article요소 안쪽 또는 바깥쪽에 올수 있는데, 안쪽의 있을 경우는 article.. 2022. 8. 16. 웹퍼블리셔를 위한 기본 배경정보(1) ※ 아래 내용은 개인적인 기록목적으로 정리해둔 내용이고, 정보의 출처를 일일히 확인하지 못하였습니다. [인터넷이란?] 전세계의 모든 컴퓨터를 연결해 놓은 지구상에서 가장 큰 네트워크로 네트워크의 네트워크라 부른다. 각 통신망들이 보유하고 있는 모든 정보를 전세계 각처에 연결된 사용자들에게 제공해주는 지구촌 통신망이다. 컴퓨터로 연결하여 TCP/IP(Transmission Control Protocol/Internet Protocol)라는 통신 프로토콜을 이용해 정보를 주고받는 컴퓨터 네트워크이다. [웹이란?(월드와이드웹이란?)] 월드 와이드 웹(World Wide Web, WWW, W3)은 인터넷에 연결된 컴퓨터들을 통해 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말한다. 간단히 웹(Web.. 2022. 8. 16. 이전 1 2 3 다음