css常見樣式

塊級元素和行內元素分別有哪些?

塊級元素:

div h1 h2 h3 h4 h5 h6 p hr 
form ul dl ol pre table   

行內元素:

em strong span a br img 
button input label select textarea
code script 

特性區(qū)別:
1.塊級元素可以包含行內元素和塊級元素,而行內元素只能文本和行內元素。
2.塊級元素設置寬高有效,行內元素設置寬高無效。
3.塊級元素可以獨占一行,其寬度自動填滿其父元素寬度,行內元素不能獨占一行,與相鄰的行內元素處在一行,直到此行被內容填滿才會換行。
4.設置margin和padding屬性,塊級元素上下左右都有效,行內元素只有左右有效。

什么是 CSS 繼承? 哪些屬性能繼承,哪些不能?

CSS繼承:繼承是指被包在內部的標簽將擁有外部標簽的樣式性,即子元素可以繼承父元素的屬性。

不可被繼承:
display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、page-bread-before和unicode-bidi。

可被繼承:
所有元素可繼承:visibility和cursor。
內聯(lián)元素可繼承:letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
終端塊狀元素可繼承:text-indent和text-align。
列表元素可繼承:list-style、list-style-type、list-style-position、list-style-image。
表格元素可繼承:border-collapse。

如何讓塊級元素水平居中?如何讓行內元素水平居中?

塊級元素 設置 margin: 0 auto 可達到居中目的

/* margin: 0 auto; 實際上是下面兩個起作用 */
  margin-left: auto;
  margin-right: auto;

行內元素水平居中text-align: center;

用 CSS 實現(xiàn)一個三角形

三角形

單行文本溢出加 ...如何實現(xiàn)?

{
  white-space: nowrap;        /*先設置文本不折行*/
  overflow: hidden;           /*設置溢出隱藏*/
  text-overflow: ellipsis;    /*設置隱藏部分為...*/
}

px, em, rem 有什么區(qū)別

px在縮放頁面時無法調整那些使用它作為單位的字體、按鈕等的大??;
em的值并不是固定的,會繼承父級元素的字體大小,代表倍數;
rem的值并不是固定的,始終是基于根元素 <html> 的,也代表倍數。

解釋下面代碼的作用?為什么要加引號? 字體里\5b8b\4f53代表什么?

body{
  font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}

作用:設置字體大小為12px,行高是字體1.5倍,后面則是第一到第五字體,用逗號隔開,如果用戶瀏覽第一字體沒有,則查詢第二字體有沒有,以此類推,如果都沒有則采用系統(tǒng)默認字體;
字體名稱為中文時,如:"微軟雅黑" ,或字體名稱為英文但是名稱有多個單詞組成,中間包含空格,如:“Times New Roman”時需要加引號,不加引號可能會導致瀏覽器無法識別字體設置。
使用瀏覽器打開頁面時,瀏覽器會讀取 HTML 文件進行解析渲染。當讀到文字時會轉換成對應的 unicode碼(可以認為是世界上任意一種文字的特定編號)。\5b8b\4f53代表宋體的unicode碼。
代碼1
代碼2
代碼3
代碼4
代碼5

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 14,168評論 1 92
  • 塊級元素和行內元素分別有哪些? block-level div h1 h2 h3 h4 h5 h6 p hrfor...
    我要認真學前端閱讀 1,215評論 0 1
  • 1、塊級元素和行內元素分別有哪些?它們的特性區(qū)別有哪些? 1、塊級元素(block element),占據其父元素...
    徐國軍_plus閱讀 544評論 0 6
  • 一.塊級元素和行內元素分別有哪些?動手測試并列出4條以上的特性區(qū)別 塊級元素: address - 地址 bloc...
    Sunset125閱讀 364評論 0 0
  • 今天有同事驅車好幾百公里,越過了幾個州來到我們的駐地,在國外總會總有一種別樣的情緒存在于每一次中國人之間的聚會。相...
    陽光灑落肩膀閱讀 184評論 3 2

友情鏈接更多精彩內容