带注释的简单样式表
忽然间，误打误撞的让 容器的内阴影和外阴影都出现了，看上去感觉有点像苹果的风格了。顺道把样式表做一下说明，让不懂样式表的，可以参考一下。熟悉样式表的就不要吐槽了，我也是学习阶段。
<style>
body{
/*网页内的元素距离浏览器的顶部50个像素*/
margin-top:50px;
/*网页内的元素距离浏览器的左边0个像素*/
margin-left:0px;
/*网页内整体背景颜色*/
background-color:#F0F0F0;
/*网页内文字的颜色*/
color:#333333;
/*网页内文字的大小为1个正常字大小*/
font-size:1em;
/*网页内文字字体设置*/
font-family:"微软雅黑", "黑体", sans-serif, Verdana, Georgia;
}
.touying{
/*表格或图层或图片 实现阴影效果，其中不加 inset 就没有内阴影*/
box-shadow: inset 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
/*表格或图层或图片 实现圆角特效*/
border-radius: 8px;
/*文字距离上下左右边框20像素*/
padding:20px;
/*容器背景颜色*/
background-color:#FFFFFF;
/*文字行间距为1.5个文字大小*/
line-height:1.5em;
/*定义容器内文字的字体样式*/
font-family:"微软雅黑", "黑体", sans-serif, Verdana, Georgia;
/*文字段落开始的时候，自动空出两个字的距离*/
text-indent:2em;
/*以下三个代码是防止表格被撑大，让文字自动换行*/
table-layout: fixed;
word-wrap:break-word;
word-break: break-all;
}
</style> |
发布:dizzy | 分类:CSS3 | 评论:0 | 浏览:
发表评论:
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。