传智CSS笔记

这也是看传智CSS的视频教程记录的笔记!

---------------------------------------------------------------------------------------------------

选择器的优先级:

行内选择器》id选择器》类选择器》标签选择器》通配符选择器》继承样式》默认样式

 

Display :

Display:inline 可以将块级标签变为行内标签

Display:block 可以将行内标签变为块级标签

Display:none 整个标签移除掉,不影响页面的布局

visibility:hidden 只是不显示,但是还是占用页面的空间

Display:inline-block 行内块元素,可以设置宽高


行内元素不能设置宽高,只能通过他的内容来撑开宽度和高度。如果设置了宽高是不会影响行内元素的显示 的。


字体:

设置font-family时,需要注意以下几点:

各种字体必须使用英文状态下逗号隔开;

中文字体需要加英文状态下的引号,英文字体一般不需要加引号。当需要设置英文字体时,英文字体必须位于中文字体名前;

如果字体中包含空格、#、$等符号,则该字体必须加英文状态下的单引号或双引号;

尽量使用默认字体,保证在任何用户的浏览器都能显示。

为了更安全的设置:

font-famliy: tahoma,arial,'Hiragino Sans GB',\5b8b\4f53,sans-serif;

前面的字体都查找失败后,在系统中找到一种sans-serif字体作为默认字体。

注意顺序,如果把sans-serif 放到前面去了,后面的都失效了。

font-weight字体粗细:

bolder  lighter 100~900(100的整数倍),有继承性

400:normal

700:bold

font-style字体风格

normal:默认值

italic:浏览器会使用斜体的字体显示,如果字体没有斜体,那么正常显示字体

oblique:浏览器会让字体倾斜显示。。。

font综合设置字体样式:

选择器{font: font-style  font-weight  font-size/line-height  font-family;}

必须按上面的语法格式顺序写,各个属性用空格分开。

不需要设置的属性可以省略(取默认值),但必须保留font-size和font-family属性!!!


空白符的处理:white-spacing:


word-break:自动换行

normal 使用浏览器默认的换行规则,不打断单词显示。

break-all 允许在单词内换行

keep-all 只能在半角空格或连字符处换行


去掉图片边框的写法:

border: 0 none;


内边距属性:padding

·········

外边距属性:margin

·········


。。。。。。。




发布了35 篇原创文章 · 获赞 10 · 访问量 4万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览