【前端】牛客练题积累——Html/Css

HTML/CSS方面:

display属性 :
block : CSS1 块对象的默认值。将对象强制作为块对象呈递,为对象之后添加新行   可以定义高度和宽度
none : CSS1 隐藏对象。与 visibility 属性的hidden值不同,其不为被隐藏的对象保留其物理空间
inline : CSS1 内联对象的默认值。将对象强制作为内联对象呈递,从对象中删除行
inline-block : IE5.5 将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内 inherit: 看display默认是不具备继承性的,使用inherit可以让其继承父对象的display属性。
 
注:内联元素加上display:block;后被块级化,可以定义其宽度和高度。块级元素一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(height)起作用。

overflow属性定义溢出元素内容区的内容会如何处理

参数是scroll时候,必会出现滚动条。
参数是auto时候,子元素内容大于父元素时出现滚动条。
参数是visible时候,溢出的内容出现在父元素之外。
参数是hidden时候,溢出隐藏。

在HTML中,通过<a>标签打开一个新链接,而<a>标签的target属性是指打开的新链接是以什么样的形式打开的;target属性的值为:

_blank  在新窗口中打开被链接文档

_self  默认。在相同的框架中打开被链接文档。

_parent  在父框架集中打开被链接文档。

_top 在整个窗口中打开被链接文档。

framname 在指定的框架中打开被链接文档。

若<form>和<a>标签同时出现该属性,form中的target起作用;

alt是html标签的属性,而title既是html标签,又是html属性。 
title标签,网页的标题就是写在<title></title>这对标签之内的。 
title作为属性时,用来为元素提供额外说明信息。例如,给超链接标签a添加了title属性,把鼠标移动到该链接上面是,就会显示title的内容,以达到补充说明或者提示的效果。 
而alt属性则是用来指定替换文字,只能用在img、area和input元素中(包括applet元素),用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。

图片加载完成后看不到alt

HTML标签的使用:
<audio> 标签定义声音,比如音乐或其他音频流。
<canvas> 标签定义图形,比如图表和其他图像。<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。

<article>标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。

<menu> 标签定义命令的列表或菜单。<menu> 标签用于上下文菜单、工具栏以及用于列出表单控件和命令。 
command 元素表示用户能够调用的命令。<command> 标签可以定义命令按钮,比如单选按钮、复选框或按钮。只有当 command 元素位于 menu 元素内时,该元素才是可见的。否则不会显示这个元素,但是可以用它规定键盘快捷键。

CSS中Position属性有四个可选值,它们分别是:static、absolute、fixed、relative。
 
static
    元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。
relative
    元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。
absolute
    元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。
fixed
    元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。相对于浏览器窗口进行定位。
 
注,IE6不支持CSS中的position:fixed属性。
 

<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前。告知浏览器的解析器,用什么文档类型 规范来解析这个文档。
严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

当定义border:none时,表示无边框样式,浏览器并不会对边框进行渲染,也就没有实际的宽度;
定义边框时,除了设置宽度外,还必须设置边框的样式才能显示出来。

CSS Sprites在国内很多人叫css精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。
利用CSS的“background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position可以用数字精确的定位出背景图片的位置。
利用CSS Sprites能很好地减少网页的http请求,从而大大的提高页面的性能,这也是CSS Sprites最大的优点,也是其被广泛传播和应用的主要原因;
CSS Sprites能减少图片的字节,曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。所以C错误
解决了网页设计师在图片命名上的困扰,只需对一张集合的图片上命名就可以了,不需要对每一个小元素进行命名,从而提高了网页的制作效率。
更换风格方便,只需要在一张或少张图片上修改图片的颜色或样式,整个网页的风格就可以改变。维护起来更加方便。

浏览器的内核引擎,基本上是四分天下:

1)Trident: IE 以Trident 作为内核引擎;

2)Gecko: Firefox 是基于 Gecko 开发;

3)WebKit: Safari, Google Chrome,傲游3,猎豹浏览器,百度浏览器 opera浏览器;

4)Presto: Opera的内核,但由于市场选择问题,主要应用在手机平台--Opera mini

注:2013年2月Opera宣布转向WebKit引擎
注:2013年4月Opera宣布放弃WEBKIT,跟随GOOGLE的新开发的blink引擎
原文地址:https://www.cnblogs.com/lww930/p/5814622.html