2020年9月24日
HTML引入外部字体
摘要： HTML5如何引入外部字体 背景 现在我需要 “Montserrat-ExtraLight ExtraLight”类型的字体，但是html的font-family中找不到这个类型的字体。 于是我需要下载该类型的字体，并通过CSS将它引入html文档中。 方法 准备好下载的字体文件 在CSS文件中写入 阅读全文
posted @ 2020-09-24 16:44 Olebaba 阅读(5501) 评论(0) 推荐(0) 编辑
CSS基础-字体
摘要： 字体变化设置 改变字体颜色 color 改变字体大小 font-size 改变字体粗细 font-weight 改变字体样式 font-family 改变字间距 letter-spacing 改变字体高宽比　transform: scale( 宽度：高度 ) /*实现伸缩效果*/ 引入外部字体样式 阅读全文
posted @ 2020-09-24 13:41 Olebaba 阅读(110) 评论(0) 推荐(0) 编辑
2020年9月23日
百度前端技术学院-基础-day7.8
摘要： 任务：参考如下设计稿实现HTML页面及CSS样式 代码 点击预览 HTML 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=de 阅读全文
posted @ 2020-09-23 17:28 Olebaba 阅读(129) 评论(0) 推荐(0) 编辑
圣杯布局的实现
摘要： 什么是圣杯布局 上部(header)和下部(footer)各自占领屏幕所有宽度。 上下部之间的部分(container)是一个三栏布局。 三栏布局两侧宽度不变，中间部分自动填充整个区域。 中间部分的高度是三栏中最高的区域的高度。 浮动方式实现 点击预览 1 <!DOCTYPE html> 2 <ht 阅读全文
posted @ 2020-09-23 14:42 Olebaba 阅读(123) 评论(0) 推荐(0) 编辑
2020年9月22日
百度前端技术学院-基础-day5.6
摘要： 今天学习了关于盒模型、浮动等页面布局的方法。 受到同学的启发，顺便学习了flex的布局。 还了解了一些编码的基本规则。 对我接下来的学习帮助很大。 交作业： HTML : https://github.com/ole511/font-end-learning/blob/master/day5.6-r 阅读全文
posted @ 2020-09-22 11:44 Olebaba 阅读(98) 评论(0) 推荐(0) 编辑
2020年9月20日
CSS基础-层叠与继承
摘要： 继承 一些属性可以被继承，一些不可以。 一般来说，字体颜色、字体大小会被继承，关于形状的如 padding 、border 、margin、width等就不会被继承。哪些属性属于默认继承很大程度上是由常识决定的。 控制继承 CSS提供了四个通用属性值来控制继承，每个CSS属性都可以接收这些值。 in 阅读全文
posted @ 2020-09-20 20:09 Olebaba 阅读(124) 评论(0) 推荐(0) 编辑
CSS基础-选择器
摘要： 基本选择器 元素 类 . ID # 标签属性选择器 属性标签选择器跟在元素选择器后，例 li [class = "a"] 匹配 带有名为attr的属性 [attr] 匹配 带有名为attr的属性的元素，其值为value。 [attr = value] 匹配 带有名为attr的属性的元素，其值可以为v 阅读全文
posted @ 2020-09-20 16:16 Olebaba 阅读(139) 评论(0) 推荐(0) 编辑
CSS基础-链接
摘要： 链接的状态 link 没有访问过的 visited 访问过的 hover 用户鼠标刚好停留在这个链接上时 focus 通过TAB键或者编程方法将一个链接选中时 active 链接被激活时 默认的链接样式 链接具有下划线 link状态是蓝色的 visited状态是紫色的 hover状态时光标变成一个小 阅读全文
posted @ 2020-09-20 12:12 Olebaba 阅读(161) 评论(0) 推荐(0) 编辑
CSS基础-列表
摘要： 列表字体和间距 当创建样式列表时，需要调整样式，使其保持与周围元素相同的垂直间距和相互间的水平间距。 示例代码 /* 基准样式 */ html { font-family: Helvetica, Arial, sans-serif; font-size: 10px; } /*设置网页字体基准大小*/ 阅读全文
posted @ 2020-09-20 12:07 Olebaba 阅读(135) 评论(0) 推荐(0) 编辑
CSS基础-边框
摘要： border border-top设置上边界 border-bottom / border-left / border-right 同理 可以为每一条边设置 : border-top-width宽度 border-top-style类型：solid实线 dashed虚线 dotted点线 doubl 阅读全文
posted @ 2020-09-20 11:48 Olebaba 阅读(114) 评论(0) 推荐(0) 编辑