본문 바로가기

CSS11

[css] 라디오 원형버튼 없애고 일반버튼으로 바꾸기 라디오버튼이나 체크박스를 없애고 일반 버튼으로 수정할 수 있는 방법을 알아보겠습니다. 저도 처음에 어떡해 바꿔야 할지 막막했습니다. 이렇게 바꿔보고 저렇게 바꿔보고 구글링도 열심히 해보았습니다.결국엔 구글링으로 알아냈습니다. 역시 대단한 구굴신입니다. ^^ 구글신을 통해 알게되었는데요. 생각보다 간단하더군요.ㅎㅎ html 바나나위에 기제된 인풋 html 코드를 삽입 하여라디오 버튼을 만들어 줍시다.css /* rario button */ /* 라디오 버튼 숨기기 (원형 디스크) 푸시 버튼 효과를 생성하기 위해 레이블을 사용합니다.*/ input[type=radio] { display:none; margin:10px; } /* 레이블 (radiobuttons에 인접한)의 look'n'feel을 변경하시면 .. 2017. 3. 23.
간단한 CSS로 구현하는 타임 라인 지금 만들고있는 사이트에서 경력을 타임 라인으로 표현하는 페이지가 있었기 때문에 코드를 소개. 코드 자체는 매우 단순하기 때문에 사용자에 따라 어떤 디자인의 사이트에 맞추는 것입니다. 문장하면 뒤죽박죽 경력 · 연혁을 깔끔하게 표시합시다! 샘플 Chrome, Firefox, Safari, IE9 · 10에서 동작 확인. 2017년3월 Web디자인 회사 설립 가나다라마바사아아차차카 2011년4월 Web디자인 회사 설립 가나다라마바사아아차차카 2012년7월 Web디자인 회사 설립 가나다라마바사아아차차카 .timeline { list-style: none;}.timeline > li { margin-bottom: 60px;} /* for Desktop */@media ( min-width : 640px ){ .. 2017. 3. 8.
디자인에 사용할 CSS 여러가지 쉐도우텍스트 흰색 + 밝은 색의 그림자. CSS로 text-shadow를 이용하여 표현할 수 있습니다. 포인트는 문자를 흰색으로 설정하고 그림자의 가로 · 세로 모두 제로를 지정하여 텍스트의 위치에 맞출 것. 안녕하세요、 반갑습니다. h1 { text-align: center; color: #fff; text-shadow: 0 0 15px #FF6694; font-size: 58px; font-family: 'Hiragino Maru Gothic Pro','ヒラギノ丸ゴ Pro W4', sans-serif;} 마커 라인 굵은 선을 텍스트에 조금 씌워 보려면 linear-gradient을 사용합니다. 값을 선택하면 선의 굵기를 조정할 수 있습니다. 디자인의 종류는 대체로 다음과 같이 3종류로 크게 나눌 수 .. 2017. 3. 7.
jQuery와 CSS3에서 손쉽게 구현할 수있는 스크롤 효과 최근 Web 디자인 갤러리 사이트에서 볼 수있는 멋진 Web 사이트는, 아무도 애니메이션 등의 효과가 근사 하지요. 그래서 이번 기사는 그 중에서도 쉽게 구현할 수있을 것 같은 효과를 하나. 스크롤하여 요소가 가시 범위에 표시되면 CSS3의 애니메이션을 사용한 효과가 실행된다는 것을 구현하고 보려고합니다. 왠지 어려울 것 ... 그리고 무작정에 있던 사람도 기본 마저 눌러두면 나머지는 생각대로 원하는대로 사용자 정의 할 수 있다고 생각 해요! 화면을 스크롤하면 아래에서 부와 ~ 응과 텍스트가 표시되는 효과를 구현하자!우선 효과를주는 요소를 HTML로 작성. 안심하십시오, 아직 아무것도 달라진 것은 없습니다.Nobody likes youEveryone left youThey're all out withou.. 2017. 3. 7.