EasyDemo*html、css显示及列表样式知识点个人总结(三&&四)

三、显示

  1. 显示方式

1.1.1显示方式

*”一切皆为框”:页面上所有的元素都可以显示为框

*块级元素

-<div>、<h1>或<p>元素等

-这些元素显示为一块内容,即”块框”

*内联元素/行内元素

-<span>、<a>元素等

-内容显示在行中,即”行内框”

1.1.2display属性

*取值

-display:none/block/inline;

*none

-让生产的元素根本没有框

-该框及其所有内容就不再显示,不占用文档中的空间

*block

-让行内元素(比如<a>元素)表现得像块级元素一样

*inline

-让块级元素(比如<p>元素)表现得像内联元素一样

  1. 光标

1.1.1光标

*默认情况下,光标会根据用户的操作发生改变

-当鼠标悬停在一个连接上时,光标将从指针形状变为手状形状

-当鼠标悬停在文本区域时,会显示I形状

-当鼠标悬停在一个按钮上时,光标会显示为箭头

*可以使用cursor属性指定显示给用户的鼠标光标类型(形状)

-可以为用户提供一种可视化的暗示,提示可以进行的操作

1.1.2cursor属性

*cursor属性定义鼠标指针放在一个元素边界范围内时所用的光标形状

*可取值

-default

-pointer

-crosshair

-text

-wait

Help等

 

四、列表样式

  1. 列表样式

1.1.1列表项标志list-style-type

*list-style-type属性用于控制列表中列表项标志的样式

-无序列表:出现在各列表项旁边的圆点

-有序列表:可能是字母、数字或另外某种计数体系中的一个符号

*无序列表取值

-none:吴标记

-disc:实心圆,为默认值

-circle:实心圆

-square:实心方块

*有序列表取值

-none:无标记

-decimal:数字(1,2,3,4,5),为默认值

-lower-roman:小写罗马数字(I,ii,iii,iv,v)

-upper-roman:大写罗马数字(I,II,III,IV,V)

-等

1.1.2列表项图像list-style-image

*list-style-image属性使用图像来替换列表项的标记

-取值为:url(),指定图像作为有序或无序列表项的标志

 

猜你喜欢

转载自blog.csdn.net/qq_36287601/article/details/81150516