팝업창을 현재 보이는 브라우저의 정중앙에 노출하는 예제입니다. This is WebPage!!! 부분적으로 설명을 하자면 width가 500이고 height가 600인 팝업을 노출할 것이고요. 이것을 현재 window의 내부 height에서 팝업의 600을 빼고 screen의 Y를 더해줍니다. 왜냐면 현재 브라우저의 screenY값을 더해주어야지 창의 중앙에 오기 때문입니다. 같은 원리로 window의 내부 width에서 팝업의 500을 빼고 screen의 X를 더해줍니다. spec 부분은 여러가지 설정을 표현하는 부분입니다. 참 쉽죠? ㅎㅎ
이것저것 혼자서 만들고 있는게 있어서 html도 건드리고 있습니다.하던중에 CSS만 가지고 중앙 정렬을 하는 방법을 찾아보았더니 있더군요.아마도 많이 사용할것 같습니다. 로딩같은것 띄울때는 더더군다나 많이 쓸것 같은. 제가 만들고 싶었던 화면입니다.대충 디자인은 이렇습니다. 답은 이것인데 설명을 드리겠습니다. 12345678910111213141516171819202122232425262728293031323334 Loading Colored by Color Scriptercs 일단 body의 margin과 padding을 다 뺏고요.그 아래의 contaner는 중앙에 노출하고 싶은 로딩 같은 이미지? 의 컨테이너 입니다. 그 부분을 설명을 드리면 width를 전부다, height를 전부다 사용하고, 그..
간단하게 CSS로 Button의 Style을 수정하는 방법입니다. 12345678910.button { background-color: #4CAF50; /* Green */ border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px;}Colored by Color Scriptercs 간단하게 이런 정도의 정의를 내릴수 있습니다. 12345.button1 {font-size: 10px;}.button2 {font-size: 12px;}.button3 {font-size: 16px;}.button4 {font-size: 20px;}.bu..
이렇게 줄은 맞는데, 테이블이 안보이고 싶을때가 있는데. 우리의 사랑스런 이클립스가 경고를 하여준다. 이렇게 되면, 뵈기 싫어진다. 그래서 다른 방법은 모르겠고. 일단 CSS를 적용해서 없애봤다. 아래와 같이 추가해서 적용하면 된다. table { border: 0 none; } td { border: 0 none; } 이상한건, 크롬에서 아예 border를 안주면, 그냥 안보여준다. html5 규격인것인지... 하여간. 저렇게 하면 border를 1로 주어도, 절대로 선이 안보인다. 적용은 항상 알아서 할것.
1. HTML에서 link요소를 이용한 external 방식: HTML File의 에 추가하여, 외부파일을 사용하는 방식 2. CSS파일에서 @import를 이용한 import 방식: CSS규칙내에서 외부의 CSS파일을 불러오는 방식@import url([css file path]) [media type and condition]; 3. HTML에서 style요소를 이용한 internal 방식: HTML파일안에 CSS규칙을 넣어서 바로 사용하는 방식 4. HTML Tag에서 Style속성을 이용한 inline-style 방식: HTML Tag에서 css 규칙을 속성으로 포함시키는 방식 네가지중에 쓰면되는데...알아서 쓰면 될듯.
- Total
- Today
- Yesterday
- ios
- docker
- Linux
- Spring
- Xcode
- nodejs
- war
- go
- golang
- tomcat
- Gradle
- centos8
- SWIFT
- windows10
- MySQL
- rxswift
- Windows
- git
- Codable
- php
- Kotlin
- android
- Java
- CentOS
- intellij
- github
- ubuntu
- Python
- enum
- cocoapods
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |