CSS

物件位置

文字效果

https://blog.xuite.net/jason_kuso/kuso/37092113-%E3%80%90html%E3%80%91%E6%96%87%E5%AD%97%E5%90%84%E5%BC%8F%E6%95%88%E6%9E%9C

import方式

https://blog.xuite.net/han31079/b747/13869483-CSS%E5%9F%BA%E7%A4%8E%E8%AA%8D%E8%AD%98

滑動確認按鈕

https://www.wfublog.com/2018/01/css-slide-on-off-swith.html

[CSS] 圖片在div內水平置中

http://stockwfj3.pixnet.net/blog/post/116998882

超連結語法

https://blog.xuite.net/han31079/b747/13940573-%E5%9F%BA%E6%9C%AC%E9%80%A3%E7%B5%90%E8%AA%9E%E6%B3%95

https://www.wibibi.com/info.php?tid=CSS_a_%E9%80%A3%E7%B5%90%E6%A8%A3%E5%BC%8F%E6%95%88%E6%9E%9C%E8%A8%AD%E8%A8%88

常用語法

<!-- 使div有超連結 -->
<div id="header" style="cursor:pointer;" onclick="location.href='http://www.blog.moocss.com/';"> 

<a href="#" style="text-decoration:none;">隱藏超連結底線範例</a>

文字css
text-align:left;　//向左對齊
text-align:right;　//向右對齊
text-align:center;　//置中
text-align:justify;　//使左右對齊本文
text-align:inherit;　//繼承父元素的 text-align 屬性

至底區域

https://www.w3schools.com/howto/howto_css_fixed_footer.asp

DIV內元素置底

第一層DIV設定：position:relative;

第二層DIV設定

      position:absolute;

      bottom:0px;

      right:0px;

http://zackwang.blogspot.com/2015/10/cssdiv.html

margin vs padding

margin-top：設定上邊界距離。
margin-left：設定左邊界距離。
margin-right：設定右邊界距離。
margin-bottom：設定下邊界距離。

padding:上距離 右距離 下距離 左距離;
四個方位的內距都不一樣，分開設定。
padding:上方與下方距離 左方與右方距離;
上下兩個方位的內距相同，左右兩的方位的內距相同。
padding:四個方位的距離;
四個方位的內距全部相同，一次設定。
padding:上方距離 左方與右方距離 下方距離;
左右兩邊的內距相同，分別設定上方與下方的內距。

內距：元素與邊框的距離

外距：元素間的間距

https://pinkyvivi.pixnet.net/blog/post/1131260

display:block 與 display:inline

display:block - 區塊，元素會以區塊方式呈現，除非設定 position 或 float。 block 的特性是可以設定高度（height）、寬度（width）、上方與下方距離，像是 div、p、ul、li 均屬 block。

display:inline - 所有文字或圖片均不換行，也就是全部都會是同一行的意思。inline 高度與寬度都不能設定，文字或圖片所佔的寬度就是他的寬度，像是 span、a、input、img、em 均屬 inline。

http://www.webtech.tw/info.php?tid=37

PreviousBootstrap NextJavaScript

Last updated 4 years ago