发表于： 2016-02-18 00:04:52
3 1415
今天完成的事情：
l 学习样式中background、border、font属性的相关值的设定
n div为块状元素如昨天所学，每个div单独在一行、width（宽）heightt(高)、顶和底部边距可设置
n 引入样式有三种：行间样式表、内部样式表、外部样式表。
n 
border的属性：border-width 边框宽度；border-style 边框样式“solid实线/dashed虚线/dotted点线；border-color 边框颜色；border-radius 边框圆角；
而这些其实是border-top；border-left;border-bottom;border-right；的集合样式。并且注意边框的交接点是斜线，即如
n background的属性:background-color 背景颜色；background-image 背景图片 background-no-repeat 背景图片不平铺；background-position 背景图片定位 （以左上角为起点X Y）、
n font的属性：font-size 文字大小；font-weight 文字加粗（blod加粗/normal正常）font-style 文字倾斜（italic 倾斜/normal正常）；line-height 行高；font-family 字体
n text的属性：text-indent 首行缩进；text-align 文本对齐方式（left/center/right）text-decoration 文本修饰（underline 下划线/line-through 删除线/overline上划线）
n background、border、font的多种样式可用集合样式表示，其中background和border无顺序要求，而font的集合样式需要注意顺序：文字加粗 文字倾斜 字体大小 行高 字体。并且字体大小和字体一定要有。
n
l 完成九宫图制作
n <!DOCTYPE html>
n <html>
n <head>
n <meta charset="UTF-8">
n <title>Document</title>
n <style>
n div{display:inline-block;}
n #box_max{width:400px;height:400px;;}
n #box_1{width:117px;height:117px;background:rgb(232,131,13);border-radius:5px;margin:4px;float: left;}
n </style>
n </head>
n <body>
n <div id="box_max">
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n <div id="box_1"></div>
n </div>
n </body>
n </html>
明天计划的事情：学习nginx配置
遇到的问题：需要用到块状元素变成内联块状元素即{display:inline-block}而我开始只是尝试让块状元素变成内联元素{display：inline}发现显示不出来，查了半天才想起昨天学的没记清楚，内敛元素在一行但不能设置宽和高。果断转内联块状元素就好了太棒了
收获：发现问题、解决问题能力经验up
返回列表
评论