MapleStory Cookie With Halo

✨ UI 33

[CSS]선택자 종류와 사용법

HTML에 적은 선택자를 CSS에서 사용하는 방법에 대해 알아보겠습니다.2024.12.22 - [✨ UI/💗 HTML] - [HTML]선택자 selector. id, class, name   #id명 {  }.class명 {   }  🌟 id와 class 선택자는 jquery에서도 #와 .로 동일하게 사용되기에 기억해두는 편이 좋습니다.  선택자 우선순위  속성 값 뒤에 !important를 붙인 속성.important { color: red !important;}인라인 스타일This is a paragraph.#id로 지정된 속성#unique { color: green;}class, attribute, 및 pseudo-class로 지정된 속성.class-name { color: purple;}..

✨ UI/💙 CSS 2024.12.23

[HTML]데이터 전달 <Form>과 그 안의 요소들(input, select...)

: server단으로 넘기는 정보를 모아 놓는 태그.   action="./form1_res.html" method="get">⭐ action = "데이터를 전달할 링크"submit 버튼을 클릭하면 실행됩니다.method = "get 또는 post" get데이터가 보여지면서 전달된다.보안이 덜 중요한 경우 사용.example) 검색 쿼리, 필터링된 리스트, 페이지 네비게이션post데이터가 숨겨져서 전달.보안이 중요한 경우 사용.example) 사용자 인증, 데이터 입력/저장, 파일 업로드. : 창제목. type="radio" name="radio" value="y">type : 타입에 따라 모양이 바뀝니다.checkbox : 여러개 선택 가능.radio : name이 같을 경우, 하나만 선택 가능하다.r..

✨ UI/💗 HTML 2024.12.22

[CSS]css란? 적용법, 주석

Cascading Style Sheets: 문서 스타일을 지정해주는 언어.     속성 : value; 속성 : value;..  인라인 스타일시트inline StyleSheethtml태그 안에 사용하는 방법.stype=" " 안에 css를 작성한다.   내부 스타일시트internal style sheet 를 이용하여 css를 작성하는 방법.란 안에 작성한다.   외부 스타일시트external style sheet: css파일을 따로 만들어 연결하는 방법.태그 안에 를 적어 사용합니다. ※ css를 적는 다양한 방법을 적어놨지만 인라인, 내부, 외부 이런 단어를 외울필요는 없습니다.🌟 보통 외부 스타일시트 방식을 사용합니다.  /* 주석 */

✨ UI/💙 CSS 2024.12.22

[HTML]선택자 selector. id, class, name

선택자를 사용하는 이유겸 예시    더보기 Happy Marry Christmas🎄   💡 결론html에서 선택자는 css, sciprt, server단에서 유용하게 사용하기 위해서 사용됩니다.  id, class, name id중복불가.id는 문서 내에서 유일해야 합니다.class중복가능.여러 태그를 묶기 위해 사용합니다.name주로 태그 안에 사용하는 태그들에서만 사용됩니다.서버로 전송되는 데이터의 이름을 지정합니다.🌟 보통 id를 사용하고, 태그들을 묶을 때는 class, 태그 안에서만 name을 사용한다고 보면됩니다.💡 선택자 대소문자를 가리지 않고 영어로 시작하면됩니다.

✨ UI/💗 HTML 2024.12.22

[HTML]이미지 img

폴더 위치src-webapp-resources-img   이미지 삽입  alt = "이미지를 설명. 이미지가 보이지 않을 경우, 이미지 설명 텍스트"src = "이미지 경로"title = "인용문(마우스 올리면 뜨는 거)"width : 가로 크기 지정.height : 세로 크기 지정.href를 넣어 하이퍼핑크를 거는 것도 가능하다. 🌟 이미지에서 하이퍼링크 걸 때 선택할 수 있는 범위 축소하기에 usemap="사용할  map 이름"추가.태그에 name="이름"을 적고 안 태그에 링크를 넣는다.coords="n, n, n, n"으로 클릭 범위를 지정한다.

✨ UI/💗 HTML 2024.12.22

[HTML]테이블 만들기 & 셀 병합

Table    : 태그 안에 만듭니다. : 테이블의 제목 : 컬럼 비율을 정합니다. : 컬럼갯수와 맞게 을 만들어 조절합니다. : 컬럼이 들어가는 부분 : 하나의 컬럼입니다. : 표 부분입니다. : 테이블 칸들을 한 줄에 모아놓습니다. : 실제 테이블 칸입니다. : table foot. 바닥란 입니다. 전체코드더보기 &lt;caption>테이블 제목 &lt;thead>컬럼 1 컬럼 2 컬럼 3 &lt;td>1 2 ..

✨ UI/💗 HTML 2024.12.22

[HTML]목록태그 <ul> <ol> <dl>

: 앞에 ●를 달아줍니다.  지금 티스토리에서 사용하는 리스트가 바로 이것입니다.태그 안에 를 사용합니다. : 앞에 숫자를 달아줍니다.  마찬가지로 태그 안에 를 사용해 적어줍니다. 안에 이 있을 경우 들여쓰기를 해줍니다. 전체코드더보기 첫 번째 항목 두 번째 항목 세 번째 항목 네 번째 항목 다섯 번째 항목 여섯 번째 항목 첫 번째 항목 두 번째 항목 세 번째 항목 &lt;p>를 적었을 경우 index로 이동 : 앞에 뭐가 안 붙는 목록.   : 목록을 감싸기 제목 내용  전체코드더보기 ..

✨ UI/💗 HTML 2024.12.21

[HTML]경로 종류와 사용법

경로 종류   절대 경로 Absolute Pathhttp로 시작한다.전체 주소로, 주로 외부 웹사이트에 연결할 때 사용한다.상대 경로Relative Path경로를 적고있는 현재 파일 위치를 기준으로 적는 것이다.프로젝트 내 가까운 다른 파일로 이동할 때 사용한다.🌟 ../ 는 바로 상위폴더를 가르킨다.🌟  ./ 는 현재 폴더를 가르킨다. 루트 상대 경로Root-Relative Path /로 시작한다.웹 서버의 루트 디렉토리를 기준으로 경로를 설정한다.🌟 / 는 가장 상위인 프로젝트를 가르킨다.

✨ UI/💗 HTML 2024.12.21

[HTML]태그 종류. 블록 & 인라인 요소

란에 사용하는 태그들에 대해 알아보겠습니다.  블록요소와 인라인 요소Block & Inline element 블록 요소줄 바꿈⭕안에 텍스트와 인라인 요소 포함 가능.안에 블록 요소 포함 가능(일부 불가).인라인 요소줄 바꿈 ❌ 안에 텍스트와 인라인 요소 포함 가능.안에 블록요소 포함 불가❌. 🌟 블록 요소는 말 그대로 🧱으로 묶어주는 역할 을 하는 태그들입니다.인라인 요소 안에 블록요소가 올 수 없기 때문에 정리를 해두지만 굳이 모두 외울 필요는 없습니다. 블록요소addressarticleasideaudioblockquotecanvasdddivdlfieldsetfigcaptionfiguerfooterh1h2h3h4h5h6headerhgrouphrnosciprtoloutputppresection tab..

✨ UI/💗 HTML 2024.12.21
반응형