Button1
일반적으로 사용하는 버튼 : 이미지를 백그라운드로 넣고 택스트는 text-indent를 이용해 우주로~
웹스퀘어용 버튼 : A 태그를 DIV 태그로 감싸서 작업
Button3
실무 은행권에서 사용하는 버튼 : A태그의 After 에 position:absolute 이용
※ F12키를 눌러서 버튼들을 확인해보면 좀더 이해하기가 쉬울꺼라고 생각됨.
그리드 사용시_웹스퀘어5
그리드 전체
- ▶ tooltipDisplay:true : cell의 데이터가 width보다 긴 경우 해당 데이터를 마우스 over시 툴팁으로 표현.
- ▶ 내용이 긴 경우 클래스 .nobr 클래스 추가하고 css에 화면넘어갈정도로 길때 어떻게 할껀지 정의해줌
- ▶ readOnly 확인(읽기 전용으로 할건지 읽기 / 쓰기로 할건지 정의)
각셀
- ▶ InputType : 기본값은 text 이며 link 나 chickbox 등 다양하게 설정가능
- ▶ width : cell의 너비값
- ▶ text-align : cell의 정렬(기본값 가운데)
- ▶ class : column에 정용될 class 를 써준다.
- ▶ readOnly : cell의 읽기/쓰기 여부
윗첨자 아래첨자
기본 윗첨자 아래첨자 정의되있는 숫자가 (엔티티코드)3까지 밖에 없습니다. 4부터 그이상이나 다른 문자를사용할때는 sup 태그나 sub태그를 이용
백그라운드 투명도 처리
(여기선 블루에 투명도 50% 주니 배경색인 레드가 50% 비쳐지면서 보라색으로 보임 )
- 보기 1 리스트를 이용해서 박스형태로 만들때
- 보기 2 기본 li의 css 에 보더를 왼쪽 오른쪽 아래만 주고
- 보기 3 fist-child 에만 위 보더를 줌
- 보기 4 ie8을 생각해서 특정 셀은 list-child말고 fist-child를 사용할것
★ ul ol 없이 목록 표현하기 (웹스퀘어 기본 제공 팔레트에 목록이 없어 불편할경우나 목록은 아니지만 목록처럼 표현할때 사용)
▶ 주로 Ul Ol 이 기본으로 제공이 안되는 웹스퀘어에서 활용(태그네임을 이용해서 웹스퀘어로도 UL OL 사용가능하지만 원클릭으로 만들수 없음).
● 일반적은 퍼블리싱에서도 사용가능. F12 눌러서 개발자모드 보시면 간단한 CSS padding 과 text-indent 만으로 사용
• 목록이 아니지만 목록처럼 보일때나 간단한 블릿이미지만 짧게 사용할경우 형식에 억메이지않고 보여줄때 사용가능 또 기본 UL OL의 기본값 제거 및 수정이 귀찮을때 간단한 class 하나로 바로 적용가능.
Open Resource : 파일명 으로 파일 찾기
- Project Explorer 창에서 ctrl + shift + r
- 원하는 파일명 입력
- 원하는 경로의 파일(한개 또는 ctrl 이나 shift 키를 이용해서 여러개) 선택 후
- Open 버튼 클릭
Search : 파일안에 내용 으로 파일 검색
- Project Explorer 창에서 ctrl +h
-
File Search 탭에서 Containing text 에 원하는 내용 입력
Scope 에 Workspace 체크(전체검색으로 생각하면됨) / Selected resources를 체크하면 선택한 자원(선택된 그룹) 내에서만 검색
[Search]버튼 클릭
- 검색중...
- 내가 검색한 내용이 포함된 파일들이 경로와함께 어떻게 사용되었는지 결과가 나옴 해당 셀을 더블클릭하여 바로 열어보고 수정할 수 있음.
Palette -> SelectBox - Property 의 renderType값을
'select'로 바꿔줘야 실제 셀렉트 박스로 됨
'native'로 주면 innDiv로 한번 감싸줌,
기본값 공백으로 두면 테이블코딩이 됨
WebSquare를 처음 사용할때 주의사항
기본값으로 가져가는 속성들이 생각보다 많기때문에 초기화작업이 필수
(초기 불필한 기본 CSS를 어느정도 정리해주는것이 편함)
내가 준 속성이 안먹거나 다른값이 표현되면 브라우저 F12를 눌러 개발자모드로 확인(기본값으로 들어간 CSS가 물고있을 확률이 높음)
기본적인 내용이지만 깜빡하거나 놓치기 쉽다(의외로 이런걸로 시간잡아먹음)