前端
Machiny
多努力一把,好好学习
展开
-
IFE 20180708 多种方式分栏实现+作业完成
文章目录1. 分两栏1.1 两侧宽度固定1.1.1 Float1.1.2 Position1.1.3 Flexbox1.2 左侧固定,右侧自适应1.2.1 Float1.2.2 Position1.2.3 Flexbox1.3 右侧固定,左侧自适应1.3.1 Flout1.3.2 Position1.3.3 Flexbox2. 分三栏2.1 两侧宽度固定,中间自适应2.1.1 Float2.1.2 Position2.1.3 Flexbox2.2 左中侧固定,右侧自适应2.2.1 Float2.2.2 Po原创 2020-12-15 23:06:52 · 153 阅读 · 0 评论 -
IFE 三种简历
简介IFE 2018 05-06天的编程作业一份 HTML 文档,用三份 CSS 进行修饰效果如图:过程HTML 文档(resume.html)先按照第一份简历大体编写了 HTML 文档,然后综合思考了一下怎么样让三份简历都好实现进行了细微修改问题:比较头痛的地方是,不知道”姓名“、”性别“等小字要使用什么标签,为了语义化一开始用的 h3;改动1:在写 style_1.css 时,将 h3 改成了 span,最后将 span 嵌套在 p 元素中;改动2:在写 style_3.css原创 2020-12-11 11:08:41 · 409 阅读 · 0 评论 -
学习笔记:响应式Web设计原则
学习笔记:响应式Web设计原则1. 简介从大屏的台式电脑到小屏的手机,我们有各式各样可以上网的设备。这些设备有着不同的屏幕尺寸、分辨率和处理能力。响应式 Web 设计是一种能自动响应不同尺寸设备的设计方法。实现这一切的核心要素是:媒介查询(Media Query)。如果你预计网站的大部分流量来自移动端,那么应该采取“移动端优先”的策略,再为PC端做兼容。如果你预计网站的大部分流量来自PC端,那么应该采取“PC端优先”的策略,再为移动端做兼容。CSS 提供了书写不同样式规则的工具,然后根据显示原创 2020-08-08 18:44:33 · 316 阅读 · 0 评论 -
学习笔记:应用无障碍
学习笔记:应用无障碍1. 简介网站应该对每个人开放和访问,这包括有视觉、听觉、行动能力或认知障碍的人。在开发项目时要考虑到各种用户的需求,这对创建开放 Web 大有帮助。本节将探讨三个一般概念:有组织良好的代码,使用适当的标记确保非文本和可视内容存在文本替代创建一个易于导航的页面,它对键盘友好拥有可访问的 Web 内容是一个持续的挑战。“可访问性”通常意味着 Web 内容和用户界面可以被广泛的受众理解、导航和交互。其中W3C 的 Web Content Accessibility原创 2020-08-08 16:41:31 · 224 阅读 · 1 评论 -
学习笔记:应用视觉设计
学习笔记:应用视觉设计1. 简介视觉设计在 Web 开发中是一个非常广泛的话题。它结合了排版、色彩理论、图形、动画和页面布局等内容。如何定义什么是好设计呢?没有一个标准的答案,但好设计背后都隐藏着相同的设计原则,这些原则在很多设计方面的书籍中都有所体现。在日常生活中,我们每天接触着大量的 Web 内容。这些内容的视觉设计会影响页面的呈现和保证用户体验。在 Web 开发中,HTML 为页面的内容提供结构和语义,CSS 控制页面的布局和外观。2. 基础属性text-align属原创 2020-07-25 00:14:09 · 169 阅读 · 0 评论 -
学习笔记:CSS基础
CSS基础1. 边距[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ATPz3Bio-1595323527783)(G:\06 blog\内边距外边距.png)]黑色与白色的字为元素内容,三个矩形加粗的黑色部分为边框;黄色区域为外边距,红色区域和蓝色区域为内边距**内边距(padding):**控制着元素内容与border之间的空隙大小**外边距(margin):**控制元素的边框与其他元素之间的距离**注意:**上面两者均可为负数,具体效果要自己多尝试;上面原创 2020-07-21 17:32:21 · 155 阅读 · 0 评论