본문 바로가기

공부 기록/HTML & CSS

 (8)
부트스트랩 연습(2) - Grid, Form, navbar - XL size layout - MD size layout & navbar - SM size layout .html Yurison Home (current) Features Pricing Disabled The Grid System 6 UNITS 6 UNITS 4 UNITS 8 UNITS 4 UNITS Auto Sized Auto Sized Auto Sized 3 UNITS 6 UNITS 3 UNITS Responsive Grid Previous Next Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui eaque quos recusandae quae perspiciatis nemo similique, magni porro iste in cor..
부트스트랩 연습(1) .html(v4.5) Bootstrap Playground Buttons Primary Secondary Success Danger Warning Info Primary Secondary Success Danger Warning Info Large button Large button Small button Small button Block level button Block level button Left Middle Right TypographyBadge You should check in on some of those fields below. × Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eligendi tempora inventore ea ..
간단한 실습(2) - Price Table (반응형 디자인과 reset CSS) Responsive Design https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design Responsive design - Learn web development | MDN Responsive design refers to a site or application design that responds to the environment in which it is viewed. It encompasses a number of CSS and HTML features and techniques and is now essentially just how we build websites by default. Consider the ..
간단한 실습(1) - Photo site .html Son/Yuri .css img { width: 30%; margin: calc(10%/6); } nav { text-transform: uppercase; border-bottom: 2px solid #f1f1f1; width: 30%; margin-left: calc(10%/6); padding: 1.5em 0; font-family: 'Prosto One', cursive; font-size: 1em; }
Button :hover :Hover - 사용자의 커서(마우스 포인터)가 요소 위에 올라가 있으면 선택된다. https://developer.mozilla.org/ko/docs/Web/CSS/:hover :hover - CSS: Cascading Style Sheets | MDN :hover CSS 의사 클래스는 사용자가 포인팅 장치를 사용해 상호작용 중인 요소를 선택합니다. 보통 사용자의 커서(마우스 포인터)가 요소 위에 올라가 있으면 선택됩니다. developer.mozilla.org ⬇️ .html Hover Me .css body { font-family: 'Roboto', sans-serif; display: flex; align-items: center; justify-content: center; height: 10..
Form Form https://developer.mozilla.org/ko/docs/Web/HTML/Element/form - HTML: Hypertext Markup Language | MDN HTML 요소는 정보를 제출하기 위한 대화형 컨트롤을 포함하는 문서 구획을 나타냅니다. developer.mozilla.org 예제1 Forms Demo Labels Enter a Username: Enter a Password: Buttons Submit Just a button Search on everywhere Search on Naver Search on Google Search on Youtube Please select --Choose an option-- Just May Cute May Pretty May..
Table Table의 구성 요소 간단한 예제 List of U.S. cities by population City State 2021 estimate New York New York 8,467,513 Los Angeles California 3,849,297 Chicago Illinois 2,696,555 Table v2 City State population 2021 estimate 2020 census New York New York 8,467,513 8,804,190 Los Angeles California 3,849,297 3,898,747 Chicago Illinois 2,696,555 2,746,388 https://developer.mozilla.org/ko/docs/Web/HTML/Element/t..
HTML 기본 구조와 Semantic Elements Semantic Elements in HTML Chicken - Yuripedia I am a LINK The chicken (Gallus gallus domesticus) is a domesticated junglefowl species, with attributes of wild species such as the grey and the Ceylon junglefowl[1] that are originally from Southeastern Asia. Rooster or cock is a term for an adult male bird, and a younger male may be called a cockerel. A male that has been castrated is a capon. An ..

티스토리툴바