my-ife-learning-journey's People
my-ife-learning-journey's Issues
这三天遇到头疼的问题
其实应该都是我不熟练的锅
1.布局怎么玩儿
2.表单怎么玩儿
3.标签和属性记不住
4.webstorm编辑器怎么玩儿
。。。。。。我只有反复看反复码了……
How to update 'fork'
刚开始用Github,发现不太懂怎么在自己的仓库更新fork过的项目,昨儿费七八力的查了很久,算是稍微有了头绪,感谢那些写过教程的前辈~
吐个槽……
祖明学长说第一至五节的任务可以在_一天内熟练掌握_,但我感觉把所有资料通读一遍的时间都要好久了……还是怪我记性不太好吧。
罪过
这十多天来都在忙着期末,赶紧结束这无聊的日子,好好研究JS。
盒模型与布局
- W3school:
- 不幸的是,IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度,而是内容、内边距和边框的宽度的总和。
虽然有方法解决这个问题。但是目前最好的解决方案是回避这个问题。也就是,不要给元素添加具有指定宽度的内边距,而是尝试将内边距或外边距添加到元素的父元素和子元素。 - 上下内边距与左右内边距一致;即上下内边距的百分数会相对于父元素宽度设置,而不是相对于高度。
- 每个边框有 3 个方面:宽度、样式,以及颜色
- 元素的背景是内容、内边距和边框区的背景
- 样式是边框最重要的一个方面,这不是因为样式控制着边框的显示(当然,样式确实控制着边框的显示),而是因为如果没有样式,将根本没有边框。(可以采用border-color: transparent创造不可见边框)
- 默认的边框颜色是元素本身的前景色。如果没有为边框声明颜色,它将与元素的文本颜色相同。另一方面,如果元素没有任何文本,假设它是一个表格,其中只包含图像,那么该表的边框颜色就是其父元素的文本颜色(因为 color 可以继承)。这个父元素很可能是 body、div 或另一个 table。
- 利用 transparent,使用边框就像是额外的内边距一样;此外还有一个好处,就是能在你需要的时候使其可见。这种透明边框相当于内边距,因为元素的背景会延伸到边框区域(如果有可见背景的话)。
- 从某种意义上说,利用 transparent,使用边框就像是额外的内边距一样;此外还有一个好处,就是能在你需要的时候使其可见。这种透明边框相当于内边距,因为元素的背景会延伸到边框区域(如果有可见背景的话)。
- 外边距合并指的是,当两个_垂直外边距_相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
- 当一个元素包含在另一个元素中时(假设没有内边距或边框把外边距分隔开),它们的上和/或下外边距也会发生合并。
- 假设有一个空元素,它有外边距,但是没有边框或填充。在这种情况下,上外边距与下外边距就碰到了一起,它们会发生合并
- 只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。(?)
- 行内框在一行中水平布置。可以使用_水平内边距_、_边框_和_外边距_调整它们的间距。但是,垂直内边距、边框和外边距不影响行内框的高度。由一行形成的水平框称为行框(Line Box),行框的高度总是足以容纳它包含的所有行内框。不过,设置行高可以增加这个框的高度。
- vertical-align:处理垂直排列
- z-index:处理图层优先级
- overflow:处理元素溢出问题
- 不幸的是,IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度,而是内容、内边距和边框的宽度的总和。
- MDN
-
外边距将该元素与其它元素分开。(所以负边距应该就是指融合了。)
-
内容区域content area 是真正包含元素内容的区域。位于内容边界的内部,它的大小为内容宽度 或 content-box宽及内容高度或content-box高。
- 如果 box-sizing 为默认值, width, min-width, max-width, height, min-height 与 max-height 控制内容大小。
- 其占用空间(行高)由line-height决定,即使有内边距与边框。
-
到目前为止,你可以通过像素来指定border大小。这在有些情况下是非常合适的,比如电脑屏幕显示。 但当用户_改变字体大小_之后,你的布局可能会发生_错位_。
因此,最好通过百分比或 ems (em) 来指定大小。 em 通常是指当前字体大小(字母m的宽度)。当用户改变字体大小时,你的布局会自己修正。
-
文本对齐会被元素的子元素继承, 所以需要在子元素中将它们关闭,以免出现意想不到的效果。
-
position
-
relative
通过为元素指定一个值,元素相对于其原来位置移动。也可以使用margin来达到同样的效果。
-
fixed
为元素指定相对于窗口的确切位置 。即使文档的其它元素出现滚动,元素位置仍然不变。
-
absolute
为元素指定相对于其父元素的确切位置。只有在父元素使用 relative, fixed or absolute 时才有效。你可以为任何父元素指定 position: relative;因为它不会产生移动。
-
static
默认值。当明确要关闭位置属性时使用。
-
-
双飞翼布局
打打气
尽管基础差,也要干趴它
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.