css中设置br标签之后的样式_CSS学习
語法:
選擇器,聲明(由一個屬性和一個值)
注釋:/* */
選擇器:
1. id選擇器,class選擇器
2. 組和選擇
3. 屬性選擇
創(chuàng)建:
html <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
html <head> <style> hr {color:sienna;} p {margin-left:20px;} body {background-image:url("images/back40.gif");} </style> </head>
html <p style="color:sienna;margin-left:20px">這是一個段落。</p>
多重樣式優(yōu)先級
(內(nèi)聯(lián)樣式）Inline style > （內(nèi)部樣式）Internal style sheet >（外部樣式）External style sheet > 瀏覽器默認(rèn)樣式
背景:
- background-color
- background-image
- background-repeat
- background-attachment
- background-position
文本:
字體:
鏈接:
- a:link - 正常，未訪問過的鏈接
- a:visited - 用戶已訪問過的鏈接
- a:hover - 當(dāng)用戶鼠標(biāo)放在鏈接上時
- a:active - 鏈接被點擊的那一刻
列表:
盒子模型:
- Margin(外邊距) - 清除邊框外的區(qū)域，外邊距是透明的。
- Border(邊框) - 圍繞在內(nèi)邊距和內(nèi)容外的邊框。擴展內(nèi)邊距
- Padding(內(nèi)邊距) - 清除內(nèi)容周圍的區(qū)域，內(nèi)邊距是透明的。
- Content(內(nèi)容) - 盒子的內(nèi)容，顯示文本和圖像。
邊框?qū)傩?
邊框輪廓:
margin(外邊距):
padding（填充）:
分組 和 嵌套 選擇器:?
/*分組*/ h1,h2,p {color:green; } /*嵌套*/ p {color:blue;text-align:center; } .marked {background-color:red; } .marked p {color:white; } p.marked{text-decoration:underline; }尺寸:
塊級元素(block)特性：
- 總是獨占一行，表現(xiàn)為另起一行開始，而且其后的元素也必須另起一行顯示;
- 寬度(width)、高度(height)、內(nèi)邊距(padding)和外邊距(margin)都可控制;
內(nèi)聯(lián)元素(inline)特性：
- 和相鄰的內(nèi)聯(lián)元素在同一行;
- 寬度(width)、高度(height)、內(nèi)邊距的top/bottom(padding-top/padding-bottom)和外邊距的top/bottom(margin-top/margin-bottom)都不可改變，就是里面文字或圖片的大小;
塊級元素主要有：
- address , blockquote , center , dir , div , dl , fieldset , form , h1 , h2 , h3 , h4 , h5 , h6 , hr , isindex , menu , noframes , noscript , ol , p , pre , table , ul , li
內(nèi)聯(lián)元素主要有：
- a , abbr , acronym , b , bdo , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , select , small , span , strike , strong , sub , sup ,textarea , tt , u , var
可變元素(根據(jù)上下文關(guān)系確定該元素是塊元素還是內(nèi)聯(lián)元素)：
- applet ,button ,del ,iframe , ins ,map ,object , script
CSS中塊級、內(nèi)聯(lián)元素的應(yīng)用：
利用CSS我們可以擺脫上面表格里HTML標(biāo)簽歸類的限制，自由地在不同標(biāo)簽/元素上應(yīng)用我們需要的屬性。
主要用的CSS樣式有以下三個：
- display:block -- 顯示為塊級元素
- display:inline -- 顯示為內(nèi)聯(lián)元素
- display:inline-block -- 顯示為內(nèi)聯(lián)塊元素，表現(xiàn)為同行顯示并可修改寬高內(nèi)外邊距等屬性
我們常將<ul>元素加上display:inline-block樣式，原本垂直的列表就可以水平顯示了。
定位:
relative：定位是相對于自身位置定位（設(shè)置偏移量的時候，會相對于自身所在的位置偏移）。設(shè)置了 relative 的元素仍然處在文檔流中，元素的寬高不變，設(shè)置偏移量也不會影響其他元素的位置。最外層容器設(shè)置為 relative 定位，在沒有設(shè)置寬度的情況下，寬度是整個瀏覽器的寬度。
absolute：定位是相對于離元素最近的設(shè)置了絕對或相對定位的父元素決定的，如果沒有父元素設(shè)置絕對或相對定位，則元素相對于根元素即 html 元素定位。設(shè)置了 absolute 的元素脫了了文檔流，元素在沒有設(shè)置寬度的情況下，寬度由元素里面的內(nèi)容決定。脫離后原來的位置相當(dāng)于是空的，下面的元素會來占據(jù)位置。
總結(jié)
以上是生活随笔為你收集整理的css中设置br标签之后的样式_CSS学习的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 女生好听唯美的网名96个
- 下一篇： jq 控制td只显示一行_CSS让表格里