본문 바로가기

CSS

 (16)
table 상하좌우 스크롤(슬라이딩)시 특정 부분 위치 고정 원문 : https://www.codingfactory.net/13033 예전에는 자바스크립트로 프로그래밍 해 주던 영역인데, position:sticky 속성을 지원하는 CSS 에서는 간단하게 구현이 됩니다. 원문에서는 하나의 테이블에 대해서만 다루었는데, 위 아래로 여러 테이블이 있는 경우에는 id 가 아니라 class 방식으로 바꾸면 정상 작동합니다. 그러면, 이제 응용편을 하나 예로 들어 봅니다. 좌우 스크롤이 되는 table 인데.. (물론, table 을 감싸는 div 에 overflow-y:hidden 적용) 상단 칼럼은 colspan 으로 셀병합(엑셀 용어.. ㅋ)되어 있고, 칼럼이 많아서 좌우 스크롤 해야 하는데.. 상단 칼럼의 내용이 스크롤 할 때 계속 보여져야 한다면...? 간소하게 ..
css 와 javascript 의 문자셋 .css 는 파일 상단에 charset 을 세팅할 수 있다. javascript 는 script 태그의 옵션에 charset 을 세팅할 수 있다.
자바스크립트 테스트용 에디터 웹사이트 https://jsfiddle.net/vtepw9zw/3/ HTML/CSS/Javascript 등에 대하여 간단하게 사용할 만한, 그러나 기능은 상당히 만족스러운 에디터.. 그것도 웹사이트에서 이런 기능을 제공하네요. HTML DOM 에 대한 console.log() 내용도 모두 보여줍니다. 간단하게 테스트 하려고, 에티터 켜고 웹브라우저 켜고, 개발자도구 켜고 이럴 필요 없이.. 상기 웹사이트에 접속해서 체크해 보세요.
웹화면 기술 순서에 대한 단상 웹화면은 아래 요소들로 이루어졌다고 볼 수 있다.- HTML 태그와 컨텐츠(리소스, 즉 사진, 음향, 동영상 등등)- HTML 태그와 컨텐츠를 화면에 제대로 표현하기 위한 CSS,- UX 를 담당하는 자바스크립트. (물론, 플래시 등의 요소가 존재하기는 하지만, 가벼운 웹사이트를 지향하자) 각종 컨텐츠는..웹서버에서 사용자 화면으로 내려지기도 하고, 사용자 화면에서 웹서버로 올려지기도 한다. 어쨌든, 사용자가 웹화면을 볼 때에는..웹서버에서 위에서 설명한 요소들이 사용자 웹브라우저에 모두 다운로드 되어야 한다. 물론, 내려지는 시차와 순서가 정해져 있거나 그렇지 않을 수 있다. 이제, 구현하는 입장에서 나열하는 순서를 생각해 보자.요즘엔 HTML5 로 수렴하는 분위기 이다 보니, 과 등이 맨 처음에 온다..
jQuery CSS 선택자, 속성에 대한 복수 항목 체크 (and or 조건) 상기 코드가 있을 때, radio 타입이면서 nameC 인 input 을 선택하려면..?뭐, 당연히.. $('input[type="radio"][name="nameC"]') 라고 하면 되는데.. 이건 and 조건 그러면.. radio 인 넘들과 checkbox 인 넘들을 다 선택하려면..?$('input[type="radio"], input[type="checkbox"]').. 라고 하면 되고, 이건 or 조건 자, 이제 radio 이고 nameC 인 넘들과 checkbox 이고 nameF 인 넘들만 선택하려면..?$('input[type="radio"][name="nameC"], input[type="checkbox"][name="nameF"]').. 라고 하면 되고, 이건 or 조건 and 조건을 [..
[모음글] 웹서비스 일반 브라우저는 어떻게 동작하는가?http://helloworld.naver.com/helloworld/59361- 모질라 재단에서 만든 Gecko 렌더링 엔진과, 리눅스 진영에서 만든 Webkit(애플이 사파리용으로 수정). 3G 모바일 네트워크의 이해http://helloworld.naver.com/helloworld/111111- Wi-Fi 에서 보다 3G 를 사용할때 전력 소모량이 늘어나고, 이통사마다 세팅이 다르다 PhoneGap 을 이용한 앱개발http://helloworld.naver.com/helloworld/8180 한글 인코딩의 이해 1편http://helloworld.naver.com/helloworld/19187
font-family font-family:돋움,Dotum,굴림,Gulim,sans-serif쉼표로 구분하여 표기한 순으로 웹브라우저가 폰트를 사용. - Apple Gothic 의 경우 iOS 에서 글자 폭에서 빈 여백이 많아서 다른 스마트기기와 차이가 나게 되므로 사용에 자제를..- iOS 에서는 돋움,Dotum 을 인식하지 못하는 모냥..- 명조 계열의 폰트는 세로선이 가로선에 비해서 얇기 때문에 웹에서는 시인성이 많이 떨어지므로 사용에 자제를..- 굴림 폰트는 일본인이 만들었다고.. ㅠ.ㅜ - Hack 핵을 사용하는 방법은.. 그냥 쓰지 마세요. 안 되면 안 되는 대로..머지않아 없어질 브라우저를 고민하지는 맙시다.. 물론, 레이아웃에 상당한 영향을 준다면야 어쩔 수 없이 핵을 사용하겠지만..http://sjpison...
기본 코드, HTML/CSS/JavaScript http://www.instacss.comHTML5 가 지원되는 웹브라우저에서 열립니다. ^^.HTML 태그가 사용 가능한 HTML 버전 (HTML5 냐 HTML4.01) 등이 정리되어 있어요. 사전이라고 보면 됩니다.사이트를 만든 정성이 여간이 아니네요..

티스토리툴바