'Programming > web 관련' 카테고리의 다른 글
| div width와 margin:auto; (2) | 2018.08.27 |
|---|---|
| tr hover (2) | 2018.08.27 |
| table border-spacing (0) | 2018.08.27 |
| 웹페이지 탭메뉴 만들기 (0) | 2018.08.22 |
| 시맨틱 코드 (2) | 2018.08.21 |
| div width와 margin:auto; (2) | 2018.08.27 |
|---|---|
| tr hover (2) | 2018.08.27 |
| table border-spacing (0) | 2018.08.27 |
| 웹페이지 탭메뉴 만들기 (0) | 2018.08.22 |
| 시맨틱 코드 (2) | 2018.08.21 |
div로 할까 하다가 그래도 표니까 table 써야지 하고 보는데
디자인 적으로 한줄 사이사이 공백이 추가되어야 하고
한줄은 구분이 없어야 하는 쪽이라 막 건드려보다 보니 이게 되네
table { border : 0px; /* 경계선의 두께 */ border-spacing: 1px 2px; /* 가로 1픽셀 띄우기 세로 2픽셀 띄우기 */ } |
[링크 : https://www.w3schools.com/cssref/pr_border-spacing.asp]
+
padding으로는 셀 안의 크기를 띄우는 거라 내가 원하는 용도로 쓰긴 힘듬
| tr hover (2) | 2018.08.27 |
|---|---|
| html button tag (4) | 2018.08.27 |
| 웹페이지 탭메뉴 만들기 (0) | 2018.08.22 |
| 시맨틱 코드 (2) | 2018.08.21 |
| sketch 플러그인 (0) | 2018.08.13 |
메뉴는 ul / li를 통해서 css 적용해 만들고
웹 페이지에서는 표시할 데이터를 놔두고
display:none; 과 display:inline-block;을 이용하여 출력/숨기기를 하는 듯
[링크 : http://imivory.tistory.com/8]
| html button tag (4) | 2018.08.27 |
|---|---|
| table border-spacing (0) | 2018.08.27 |
| 시맨틱 코드 (2) | 2018.08.21 |
| sketch 플러그인 (0) | 2018.08.13 |
| jquey dom (0) | 2018.08.10 |
| sass scss (0) | 2018.09.05 |
|---|---|
| hover inline css (0) | 2018.08.27 |
| css BEM( Block Element Modifier) (0) | 2018.08.21 |
| css float overflow (0) | 2018.08.20 |
| css 우선순위 (0) | 2018.08.09 |
css를 작성하다 보니
어떻게 운용해야 할지 고민하다가 찾는중.
BEM은 일종의 클래스 명 작성규칙이고
쓰기 나름이긴 한데.. 어떤식으로 운영하는게 나을지 모르겠다...
예를들면.. 색상에 대한 class와 font에 대한 클래스를 구분하고
사용하는 곳에서 복수개의 class를 사용하는 방법과
특성에 따른 class를 개별로 정의하여 사용하냐 정도의 차이?
[링크 : https://www.vobour.com/-css-디버깅-시간을-절약-할-수있는-css-명명-규칙]
[링크 : https://windtale.net/blog/maintainable-expandable-front-end-web-strategy/]
[링크 : http://wikibootup.org/post/css-co-work/]
[링크 : https://hyeonseok.com/docs/about-css/]
| hover inline css (0) | 2018.08.27 |
|---|---|
| css selector (0) | 2018.08.21 |
| css float overflow (0) | 2018.08.20 |
| css 우선순위 (0) | 2018.08.09 |
| css 문법 - id / class (0) | 2016.01.11 |
웹 퍼블리싱 관련 이것저것 보다 보니 보여서 검색
일단 semantic은 "의미적"이라는 뜻인데
기존의 <b>와 같이 bold로 굵게 하라는 행동 기반이 아닌
<strong>이라는 강하게 표현하고 표현 방식은 뒤로 맡기는 그런 류의 접근 방식으로 보인다.
가장 많이 보는 걸로는
<header>
<nav>
<section>
<footer> 등이 있다고 하면 간단하게 이해 될 듯
HTML구성 요소로서 어떠한 보여주는게 아닌
어떠한 문맥을 의도를 보여주는 meta 데이터로서의 tag 라고 하면 되려나?
[링크 : https://www.w3schools.com/html/html5_semantic_elements.asp]
[링크 : http://west849.tistory.com/4]
| table border-spacing (0) | 2018.08.27 |
|---|---|
| 웹페이지 탭메뉴 만들기 (0) | 2018.08.22 |
| sketch 플러그인 (0) | 2018.08.13 |
| jquey dom (0) | 2018.08.10 |
| eclipse php sftp (0) | 2017.10.03 |
모든 것의 원흉은 이녀석이었나..
단순하게 div를 왼쪽부터 딱딱딱 원하는 순서로 쌓는용도로만 생각을 했는데
말그대로 float 하게 하는거라 내가 의도하는 것과는 전혀 다른 형태로 작동해서 멘붕중
정 안되면
style="clear:both;" 와
style="overflow:hidden;" 을 해주면 내가 쓰려는 용도로는 충분하네..
[링크 : http://naradesign.net/wp/2008/05/27/144/]
[링크 : http://blog.wystan.net/2008/09/11/css-overflow-clearing-float]
overflow:hidden은 float로 하면 구성요소에서 빠져나가
상위 div의 높이 계산이 갱신되지 않는데, overflow:hidden을 해주면 float로 된 div를 포함하여 높이를 계산한다.
| css selector (0) | 2018.08.21 |
|---|---|
| css BEM( Block Element Modifier) (0) | 2018.08.21 |
| css 우선순위 (0) | 2018.08.09 |
| css 문법 - id / class (0) | 2016.01.11 |
| html css 적용 방법 (0) | 2016.01.11 |
node.js에서 소스 건드리면 빌드하고
자동으로 웹 브라우저 리프레시 하는데 그게 신기해서 검색
[링크 : https://www.npmjs.com/package/browser-refresh]
[링크 : http://2ality.com/2012/08/jsreload.html]
+ 2018.09.04
전에 한걸 보니 node.js가 아니라 angular 였고,
순수 node.js에서는 서버 재시작이나 브라우저 갱신이 지원되지 않는다.
그래도 위의 browser-refresh가 더 인기가 좋은 듯
[링크 : https://www.npmjs.com/package/reload]
+ 2018.09.06
| node.js와 웹소켓 (0) | 2018.09.03 |
|---|---|
| node.js 와 v8 (0) | 2018.08.29 |
| node.js odroid (0) | 2018.08.29 |
| html5 / css3 / jquey ajax / angularJS (0) | 2018.08.08 |
| typescript - ts (2) | 2018.08.07 |
| 웹페이지 탭메뉴 만들기 (0) | 2018.08.22 |
|---|---|
| 시맨틱 코드 (2) | 2018.08.21 |
| jquey dom (0) | 2018.08.10 |
| eclipse php sftp (0) | 2017.10.03 |
| aptana studio 설치 (0) | 2017.10.03 |
document.getElementById(id).onclick = function(){code}
[링크 : https://www.w3schools.com/js/js_htmldom_document.asp]
$(document).ready(function(){
$("p").dblclick(function(){
$(this).hide();
});
});
| 시맨틱 코드 (2) | 2018.08.21 |
|---|---|
| sketch 플러그인 (0) | 2018.08.13 |
| eclipse php sftp (0) | 2017.10.03 |
| aptana studio 설치 (0) | 2017.10.03 |
| HTML fieldset / legend (0) | 2017.05.26 |