web前端之html和CSS
文章平均质量分 84
做枚温婉的妹纸吧哈哈
这个作者很懒,什么都没留下…
展开
-
前端面试学习笔记之HTML
基础1.混杂模式和标准模式文档类型文档类型声明<!DOCTYPE>即document type,目的在于告诉浏览器应该用哪种html或者xhtml规范来解析文档(解释那些html标签、css等)。在dtd(document type defination)指定文档类型。 xhtml1.0 的dtd有三种声明:过渡模式:一种要求不很严格的,允许在html中使用html 4.01的标识(符合xhtm原创 2015-06-17 19:23:11 · 790 阅读 · 0 评论 -
display:table、box和width百分比来均分盒子的比较(2)
boxbox适合均分内部子盒子没有边框的父盒子,否则内部盒子的边框重叠问题不太好处理,另外如果自盒子间有margin值,中间的margin会是两侧的double,这时可通过nth-child(index)来进行个别调整。 box-flex是对除开子盒子内容区、定宽子盒子之外的剩余部分进行划分,而不是把父盒子的整个宽度进行划分,因此就会造成所有子盒子都设置为box-flex:1,但因为子盒子内原创 2016-05-29 11:24:14 · 3598 阅读 · 0 评论 -
实践中遇到的问题总结
body在默认情况下占据了当前可视窗口的整个高度和宽度如果想让盒子中的内容垂直居中,可以让盒子的line-height和盒子的高度相等。默认情况下,盒子的高度和宽度值都是auto,但空盒子是看不见的,必须有内容才看的见,当有内容时,盒子的宽度等于父元素内容区宽度;高度需由盒子中包含的内容来撑开。如果子元素盒子定义的高度超过了父元素,父元素不会自动扩展其高度而是被子元素覆盖了。原创 2016-05-29 11:22:54 · 8622 阅读 · 2 评论 -
垂直和水平居中方法小结
水平居中行内元素text-align:center;块元素1.定宽块元素水平居中 margin:0 auto;2.不定宽块元素水平居中方法一:利用浮动的包裹性和百分比相对定位<div class='outer'> <div class='inner'></div></div>我们想要使inner(不定宽)水平居中于outer,可以这么做: 先在inner外面再加一层div:<div cla原创 2015-10-14 12:25:28 · 1232 阅读 · 1 评论 -
CSS3 box学习笔记
CSS3提供的盒子样式可实现对盒子内部元素的弹性布局,我们就不用使用float或者display:inline来使块元素横向排布(box-orient可以做到),或者计算每个块的宽度or百分比来实现均分(box-flex可做到)。so,大胆地用吧妹纸。对父元素设置display:box,可对内部的块级子元素进行布局,此时,内部的元素按照内联元素的排列方式,但可以设置宽和高。对父盒子使用如下的样式:1原创 2015-09-21 11:04:59 · 1019 阅读 · 0 评论 -
display:table、box和width百分比来均分盒子的比较
如何均分父元素box学习 当父元素设置为display:box后,子盒子不能通过margin:0 auto来实现水平居中,需要通过设置box-pack和box-align来实现居中。此时,内部块级子盒子不再占满整行,而是由其内容多少来决定的。当一个块级元素设置为display:inline-block/inline,都可以设置其父元素text-align:center来实现居中。通过原创 2015-09-01 15:44:26 · 6699 阅读 · 0 评论 -
CSS基础学习笔记
1.CSS样式优先级 元素上的样式> style中嵌入的样式>外部样式文件,其实不太准确,应当是当嵌入式出现在外部样式的后面时,按照style出现的顺序来渲染的,后面出现的会覆盖前面的。 同一个样式文件中,元素选择器越精确优先级越高,id选择器(100)>类选择器(10)>元素选择器(1),根据权值(累计值)来确定使用哪种样式(继承的权值最低);权值相同,出现越靠后的优先级越高;原创 2015-05-22 14:19:41 · 759 阅读 · 0 评论 -
HTML学习笔记一(慕课网)
1. em:斜体强调 strong:粗体强调 span:无语义,就是为了单独设定某种样式2. 标记一行代码: 标记多行代码: 会保留空格和换行符3. 当表格table内容很多时,会下载一点显示一点,如果用了tbody标签则会全部下载完后再显示 表格摘要不会再浏览器中显示,但是会帮助搜索引擎更好地读懂表格内容,4. 中titl原创 2015-05-18 10:18:05 · 897 阅读 · 0 评论 -
使用github上传代码
一. 安装github客户端原创 2015-05-21 12:06:22 · 793 阅读 · 0 评论 -
CSS之浮动
浮动带来的影响浮动使元素脱离了文档流,后面的元素当该浮动元素不存在,会顶替它的位置。如果浮动元素后面的元素中包含文本,则文本会为浮动元素让出空间来,形成环绕浮动元素的效果。此外,由于浮动元素脱离的文档流,则对父元素来说不具备高和宽,父元素不再会伸缩高度来将浮动的子元素包括进来,会造成父元素塌陷。 浮动元素会向左或向右浮动直到它碰到父元素的边框或者其他浮动元素。清除浮动带来的影响可以对浮动元素后面的原创 2015-06-19 16:50:23 · 739 阅读 · 0 评论 -
html学习笔记二(W3CSchool)
1. 确保使用标题标签时是因为确实内容为标题而不是为了大号的字体,搜索引擎会使用标题为网页结构和内容编制索引2.标签:预格式文本,保留了空格和换行,适合显示代码3. 为文本添加删除线:;添加下划线:4.align属性在XHTML和html 4.01中不被支持,例如,请在样式表中进行定义:text-align:5.使用来组合行内元素并使用样式设计其外观6.标签(1)targe原创 2015-05-22 14:43:30 · 1059 阅读 · 0 评论 -
CSS学习笔记二(W3CSchool)
1. 子选择器 > 只选择第一个匹配的项,后面的会忽略,例如h1 > strong {color:red;}This is very very important.This is really very important. 只会选择第一个h1下的strong标签,而第二个h1下的则会忽略。而后代选择器则会全部选择。原创 2015-05-24 15:53:49 · 872 阅读 · 0 评论