1. 对齐
- 对齐块元素
块元素指的是占据全部可用宽度的元素，并且在其前后都会换行。
块元素的例子：
<h1>
<p>
<div>
- 使用 margin 属性来水平对齐
通过将左和右外边距设置为 "auto"，来对齐块元素。
.center
{
margin-left:auto;
margin-right:auto; #或者直接使用margin:auto;
width:70%;
background-color:#b0e0e6;
}
- 使用 position 属性进行左和右对齐
对齐元素的方法之一是使用绝对定位：
.right
{
position:absolute;
right:0px;
width:300px;
background-color:#b0e0e6;
}
- 使用 float 属性来进行左和右对齐
.right
{
float:right;
width:300px;
background-color:#b0e0e6;
}
2. 尺寸 (Dimension)
| 属性 |
描述 |
| height |
设置元素的高度。 |
| line-height |
设置行高。 |
| max-height |
设置元素的最大高度。 |
| max-width |
设置元素的最大宽度。 |
| min-height |
设置元素的最小高度。 |
| min-width |
设置元素的最小宽度。 |
| width |
设置元素的宽度。 |
3. 分类
| 属性 |
描述 |
| clear |
设置一个元素的侧面是否允许其他的浮动元素。 |
| cursor |
规定当指向某元素之上时显示的指针类型。 |
| display |
设置是否及如何显示元素。 |
| float |
定义元素在哪个方向浮动。 |
| position |
把元素放置到一个静态的、相对的、绝对的、或固定的位置中。 |
| visibility |
设置元素是否可见或不可见。 |
<body>
<p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p>
<span style="cursor:auto">
Auto</span><br />
<span style="cursor:crosshair">
Crosshair</span><br />
<span style="cursor:default">
Default</span><br />
<span style="cursor:pointer">
Pointer</span><br />
<span style="cursor:move">
Move</span><br />
<span style="cursor:e-resize">
e-resize</span><br />
<span style="cursor:ne-resize">
ne-resize</span><br />
<span style="cursor:nw-resize">
nw-resize</span><br />
<span style="cursor:n-resize">
n-resize</span><br />
<span style="cursor:se-resize">
se-resize</span><br />
<span style="cursor:sw-resize">
sw-resize</span><br />
<span style="cursor:s-resize">
s-resize</span><br />
<span style="cursor:w-resize">
w-resize</span><br />
<span style="cursor:text">
text</span><br />
<span style="cursor:wait">
wait</span><br />
<span style="cursor:help">
help</span>
</body>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
