菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 前端基础-范建荣-20230420 [打印本页]

作者: °荣 时间: 2023-4-20 08:54
标题: 前端基础-范建荣-20230420
一学习内容

元素的显示和隐藏

类似于网站广告，点击关闭按钮，元素消失，这个时候就需要用显示和隐藏元素

Display显示和隐藏：（使用频率最高）

display：nono；代表隐藏对象，不再占有原来的位置

display：block；除了能将元素转化为块元素以外，也可以让元素显示

Visibility显示和隐藏

属性值：visible 元素可视

Hidden 元素隐藏：隐藏之后还会占有原本来的位置

Overflow溢出显示和隐藏

属性值：

Visible 不减切也不添加滚动条

Hidden 将超出盒子的内容隐藏掉

Scroll不管内容是否超出盒子的范围，都显示滚动条

Auto盒子中内容超出盒子显示滚动条，不超出不显示

鼠标样式的设定

属性名：cursor

属性值：

Default默认的鼠标样式

Pointer小手的鼠标样式

Move移动的鼠标样式

Text文本的鼠标样式

not-allowed禁止鼠标样式

输入框删除外框

outline：none

文本域取消拖拽

Resize:none

行内元素的对齐方式：vertical-align

属性值

Top顶线对齐

Middle中线对齐

Base-line 基线对齐(默认值)

Bottom 底线对齐

Css的三角制作

先将盒子的宽高设置为0，将四边边框颜色改为透明色，然后想用哪一个三角，就将哪一个边框设置颜色即可

省略号的制作：

先让文本强制一行显示

white-space：nowrap

将超过父盒子宽度的内容给隐藏掉

Overflow：hidden

用省略号将被隐藏的内容给替换掉

text-overflow：ellipsis

二学习问题
无
三是否解决
无

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)