如何查看或如何知道在使用css時根據屏幕放置控件的位置？

-1

我使用NetBeans 8.0.1和我有這個內容的css文件：如何查看或如何知道在使用css時根據屏幕放置控件的位置？

/* null margins and padding to give good cross-browser baseline */ 
html,body,address,blockquote,div, 
form,fieldset,caption, 
h1,h2,h3,h4,h5,h6, 
hr,ul,li,ol,ul,dd,dt,dl, 
table,tr,td,th,p,img { 
    margin:0; 
    padding:0; 
} 

img,fieldset { 
    border:none; 
} 

hr { 
    display:none; 
    /* 
     HR in my code are for semantic breaks in topic/section, NOT 
     style/presenation, so hide them from screen.css users 
    */ 
} 

@media (max-width:600px) { 
    * { 
     -webkit-text-size-adjust:none; 
     -moz-text-size-adjust:none; 
     -ms-text-size-adjust:none; 
    } 
} 

body { 
    font:normal 85%/150% "segoe ui",helvetica,sans-serif; 
} 

.ss_scripted img { 
    display:none; 
} 

.ss_scripted .ss_show { 
    display:block; 
} 

#slideShow img { 
    margin:0 auto; 
} 

#slideCounter { 
    text-align:center; 
    padding:0.25em 1em; 
    font:bold 200%/120% consolas,courier,monospace; 
    color:#C00; 
} 

#slideControls { 
    width:512px; 
    padding:0.5em 0; 
    margin:0 auto; 
} 

#slideControls a { 
    float:left; 
    padding:0.25em 0.6em; 
    text-decoration:none; 
    color:#000; 
    background:#EEE; 
    border:2px solid #666; 
    -webkit-border-radius:1em; 
    -moz-border-radius:1em; 
    border-radius:1em; 
    -webkit-box-shadow: 
     inset 0 -0.5em 1em rgba(0,0,0,0.3), 
     0 0 1px #000; 
    -moz-box-shadow: 
     inset 0 -0.5em 1em rgba(0,0,0,0.3), 
     0 0 1px #000; 
    box-shadow: 
     inset 0 -0.5em 1em rgba(0,0,0,0.3), 
     0 0 1px #000; 
} 

#slideControls a:active, 
#slideControls a:focus, 
#slideControls a:hover { 
    background:#FFF; 
} 

#slideControls .next { 
    float:right; 
}

我如何可以實時看到它把並且更改控件和其他東西的位置？

我可以改變這些值並每次運行看看，但這是很多工作。

例如在c＃中有一個設計師。這就是我的意思，就像設計師。

來源

2014-11-05 Ronit Halifi

想知道爲什麼你選擇了一個遲到的答案，提供與我的相同的信息.. – 2014-11-06 12:07:47