浅谈HTML（css基础样式）

作者：佚名字体：[增加减小] 来源：互联网时间：2017-08-06

本文主要包含HTML,css,基础等相关知识,佚名希望在学习及工作中可以帮助到您

solid 边框加粗
border：5px 设置边像素
display:inline-block 横着显示块状的
line-height:40px 字体上下居中
text-align：center 字体左右居中
margin-right：20px 调整外界边框

<body style="margin: 0px">
<div style="width: 80px;height: 40px;border: 5px salmon solid;
display: inline-block; line-height: 40px; text-align: center;
margin-right:20px">呵呵</div>
<div style="width: 80px; height: 40px;border: 5px slateblue solid;
display: inline-block;line-height: 40px; text-align: center;
margin-right: 60px">导航</div>

www.jb51.net

2. margin;边距，顺序是上，右，下，左可以负数

<div style="width: 200px;height: 200px;border: 5px salmon solid;">
<div style="width: 100px;height: 100px;border: 5px seagreen solid;
margin: 20px 30px 20px 50px"></div>
</div>

www.jb51.net

2.1 padding:内边距顺序一样，上，左，下，右，从内边缘开始长胖

<div style="width: 200px;height: 200px;border: 5px salmon solid;">
<div style="width: 100px;height: 100px;border: 5px seagreen solid;
padding: 20px 30px 20px 50px"></div>
</div>

www.jb51.net

3.margin-top 设置元素的上外边距，如果有多个边距则选择最大值

<div style="width: 200px;height: 200px;background-color: #FF0000;
margin-top: 100px">
<div style="width: 100px;height: 100px;background-color: aqua;
margin-top: 30px"></div>
</div>

www.jb51.net

浮动调整

1.无浮动效果

<div style="width: 200px; height: 200px;border: 10px darkmagenta solid">无与伦比</div>
<div style="width: 300px;height: 300px;background-color: chartreuse">的美丽</div>
<

您可能想查找下面的文章:

相关文章

文章分类

最近更新的内容