Rumah > hujung hadapan web > tutorial css > CSS--布局(Layout)

CSS--布局(Layout)

巴扎黑
Lepaskan: 2017-06-28 10:36:48
asal
2151 orang telah melayarinya

clear:

属性的值指出了不允许有浮动对象的边.

默认值:none

取值 描述
none 允许两边都可以有浮动对象
left 不允许左边有浮动对象
right 不允许右边有浮动对象
both 两边都不允许有浮动对象

 

float:

该属性的值指出了对象如何浮动.

默认值:none

取值 描述
none 对象不漂浮
left 文本流向对象的右边
right 文本流向对象的右边

 

例子:

例子 效果
    <p style="float:left">
        天津
    </p>
    <p>
        计算机
    </p>

    <style type="text/css">
        p
        {
        	border:dashed 1px black;
        	width:150px;
        	height:70px;
        	scrollbar-track-color :ThreedDarkShadow;
        }
    </style>
Salin selepas log masuk
image

 

clip:

检索或设置对象的可视区域.可视区域之外的部分是透明的.

position属性的值为absolute,此属性才可以使用.

语法:

auto | rect(num,num,num,num)

默认值:auto

注意:必须要是元素的position属性为absolute时才可以.clip裁切的计算坐标都是以左上角即(0,0)点开始计算

image

取值 描述
none 对象无剪切.
rect(num num num num) 依据上-右-下-左的顺序提供对象左上角的(0,0)坐标计算的四个偏移数值,其中任何一个值都可用auto替换,即此边不剪切.

 例子:

例子 效果
    <img src="1.jpg" style="position:absolute;
        clip:rect(0px 130px 60px 50px)" />
    <img src="1.jpg" style="position:absolute; top:130px;"/>
Salin selepas log masuk
image

Atas ialah kandungan terperinci CSS--布局(Layout) . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan