三、显示
- 显示方式
1.1.1显示方式
*”一切皆为框”:页面上所有的元素都可以显示为框
*块级元素
-<div>、<h1>或<p>元素等
-这些元素显示为一块内容,即”块框”
*内联元素/行内元素
-<span>、<a>元素等
-内容显示在行中,即”行内框”
1.1.2display属性
*取值
-display:none/block/inline;
*none
-让生产的元素根本没有框
-该框及其所有内容就不再显示,不占用文档中的空间
*block
-让行内元素(比如<a>元素)表现得像块级元素一样
*inline
-让块级元素(比如<p>元素)表现得像内联元素一样
- 光标
1.1.1光标
*默认情况下,光标会根据用户的操作发生改变
-当鼠标悬停在一个连接上时,光标将从指针形状变为手状形状
-当鼠标悬停在文本区域时,会显示I形状
-当鼠标悬停在一个按钮上时,光标会显示为箭头
*可以使用cursor属性指定显示给用户的鼠标光标类型(形状)
-可以为用户提供一种可视化的暗示,提示可以进行的操作
1.1.2cursor属性
*cursor属性定义鼠标指针放在一个元素边界范围内时所用的光标形状
*可取值
-default
-pointer
-crosshair
-text
-wait
Help等
四、列表样式
- 列表样式
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(),指定图像作为有序或无序列表项的标志