发表于: 2019-11-07 22:28:19
1 955
今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin)
办理入学相关手续,之后看深度思考
1.css可以绘制哪些常见的特殊形状?
特点是放大后图像不会失真,文件的占用空间较小,可以减少http的请求。
在css绘制图形时,一般要使用到border-radius,transform(旋转:rotate,缩放:scale,倾斜:skew,移动:translate)等属性来实现
圆形,发现超过它宽度的一半 大于一半之后就始终保持圆形了
跟着学做了看看
border-radius: 200% 0 0 200% / 100% 0 0 100%;
这个写法没读懂 用px也只是略懂。。。
学无止境,真的基本所以图形都能实现。。。找了几个比较实用的了解了一下。
2.如何理解vertical-align与line-height?
line-height行高指文本行基线之间的距离,只影响行内元素和其他行内元素,不直接影响块级元素
line-height:normal 值为字体1.2倍 默认
当行间距小于字体时
行内元素的边框边界由字体控制 不是行高
vertical-align的百分比值是相对于line-height计算的
{ line-height: 30px;
vertical-align: -3px; /* = 30px * -10% */ } 对于垂直对齐来说,图像本身的高度无关紧要,关键是line-height的值
垂直对齐应用于 行内元素 替换元素 表单元格
<div>这里放一张图片</div>图片下面有一段空白空间
这段空白间隙就是vertical-align和line-height携手搞的鬼
对于内联元素,vertical-align与line-height虽然看不见,但实际上到处都是!
垂直对齐vertical-align默认值是baseline基线对齐。
基线就是字母X的下边缘,图片的下边缘就和后面zxx中的字母x下边缘对齐。
字符zxx本身是有高度的,于是,图片下面就留空了,zxx文字的高度是由行高决定的。
图片下面留白,就是vertical-align和line-height造成的
去掉间隙 vertical-align和line-height随便搞定一个就可以了
图片默认是inline水平的,而vertical-align对块状水平的元素无感。只要让图片display
水平为block
就可以了,可以直接设置display
或者浮动、绝对定位等(如果布局允许)
img { display: block; }
没有空白了
修改line-height值
下面的空隙高度,只要行高足够小,下面没有了高度区域支撑,自然,图片就会有容器底边贴合在一起了。比方说设置行高5像素
告别baseline, 取其他属性值bottom middle top都是可以的,
div { font-size: 0; } 也可以解决
——————————————————————
div { line-height: 240px; font-size: 0; }
img { vertical-align: middle; } 这种通过line-height定高,元素vertical-align:middle垂直居中 / 这个暂未理解,先记下
————————————————————————
4.title与h1、b与strong、i与em、img的alt与title、src与href有什么区别
titles是网站标题
h1是标题
b和strong 用strong居多,b尽量少用
i和em 用em居多 i少用
scr 是引入 在 img、script、iframe 等元素上使用
href 是超文本引用,指向需要连结的地方,是与该页面有关联的。在 link和a 等元素上使用。
src通常用作“拿取”(引入),href 用作 “连结前往”(引用)
5.如何使用IconFont?
百度搜索 进入官网 ,注册账号,新建图标库
搜索图标点击加入购物车
把上面这些文件都放在一个文件夹内,然后放在你的项目目录中,再引入iconfont.css文件
插入这块没明白 留给明天解决吧
6.HTML中dl、ul、ol用哪个比较好?
ul 无序列表
无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。
无序列表始于 <ul> 标签。每个列表项始于 <li>。
黑点可以用 list-style: none; 去除
有序列表
同样,有序列表也是一列项目,列表项目使用数字进行标记。
有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。 加type=“A” 按A B C D等顺序
黑点可以用 list-style: none; 去除
定义列表
自定义列表不仅仅是一列项目,而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
这个用出来的效果和网上别人的不一样
明天计划的事情:(一定要写非常细致的内容)
看看CSS外链接怎么弄,了解弹性盒子
遇到的问题:(遇到什么困难,怎么解决的)
IconFont? 把文字下载到本地,插入css 没明白
收获:(通过今天的学习,学到了什么知识)
了解vertical-align和line-height
评论