HTML5 / CSS3 – NAVIGATION自我疑惑和解答

简介:

1、现在的主流网页的尺寸是多少?

PC的屏幕宽度,一般都在1000像素以上(目前主流宽度是1366×768),有的还达到了2000像素。手机的屏幕比较小,宽度通常在600像素以下。因此现在,要在大小迥异的屏幕上,都呈现出满意的效果,并不是一件容易的事。

即使专业地接触前端已经一年半了,在这个问题上我开始一直被困扰着。通过这次,很想能够寻找出一个答案。

观察过很多个网站,是采用不同的设备用不同的网页代码,但是这样维护起来就相当于要维护好几个网站。如果一次性做出来,不是更省心吗?

下面,说几种我找到的解决方法:

(1)宽度:使用%取代px等方式定义宽度

(2)字体:使用em取代px

(3)定位:多使用灵活的浮动float

(4)图片:采用max-width和%形式来显示,这样就可以自己适应屏幕的大小了。

2、body里面框个的作用是什么?

暂时理解为定位整个页面,防止有意想不到的问题。

但是暂时没有碰到过因为不加而产生的问题,我也没有办法通过实际去理解。希望各位有经验的大神指点一下。

3、css结构里,让所有浏览器都支持的代码真的好用吗?

其实网络上有很多种兼容各种浏览器的方法,特别是ie6\ie7\ie8的。但是各个浏览器的兼容效果始终是有所差异的,如果都要兼容起来,恐怕是一门大学问。

我们可以在最基础上提前预防。

但是很多时候,都是根据碰见了哪个问题,再针对问题进行一一解决。我个人比较赞同这种方式,因为有些为了兼容性而写的代码,如果有效性不够高,可能会限制到正常写代码的效果。

4、html5里的具体作用是什么?现在有多少浏览器支持?效果是怎样?

标签是 HTML 5 中的新标签。

主流浏览器效果:IE6/IE7/IE8上并不能识别,需要进行JavaScript处理。因此,为了保证兼容,还是要在其内部写一个

类似的html5的新标签汇总:

  • 定义页面或区段的头部;
  • 定义页面或区段的尾部;
  • 定义页面或区段的导航区域;
  • 页面的逻辑区域或内容组合;
  • 定义正文或一篇完整的内容;
  • 定义补充或相关内容;

26141014-d0cb8979167543a3bcb77ffd2fcff1f8

5、重新认识absolute的作用。(绝对定位)

生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。

元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。

6、重新认识relative的作用。(相对定位)

生成相对定位的元素,相对于其正常位置进行定位。

因此,”left:20″ 会向元素的 LEFT 位置添加 20 像素。

7、display:inline;对


的作用效果?

display 属性规定元素应该生成的框的类型。

display:inline;的作用:使段落生出行内框。对于


来说,使它们在同一行。

8、为什么要-webkit--moz--o-前缀?具体含义是什么?

针对不同浏览器,CSS有一些前缀,如:

Chrome:-webkit-(最新版的Chrome已经没有采用webkit内核了,但是Safari一直是采用的webkit,并且几乎所有的移动浏览器都使用webkit) 
Firefox:-moz-( Firefox 3.6 – Firefox 15需要加 ) 
IE:-ms-(没有必要添加,因为从来没有一个稳定的ie支持) 
Opera:-o-(低于Opera 12.10的版本,可不加)

为什么要加这些前缀呢?

浏览器使用前缀来尝试一些新属性、值和选择器,即便它们还没有最终定稿——这是一个好的测试方法,在必要时也可以对它们进行修正或者重新定义。如果浏览器一上来就直接使用标准属性,那它们就会被直接锁定在这个特性的实现上而不易变更。

9、visibility的作用是什么?

visibility:元素是否可见。

浏览器情况:所有主流浏览器都支持 visibility 属性。

值的使用方法:

(1)visible:默认值。元素是可见的。

(2)hidden:元素是不可见的。

10、»是什么?

显示为:»

11、怎么让wordpress导航自动居中?因为它的宽度会根据内容而变化。

这是一个值得研究的问题,今天好困- -先睡觉了哦~下次专门发篇文章解决这个问题,会给链接地址的。

目录
相关文章
|
9天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
19 0
|
4天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
13 1
|
4天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
12天前
|
XML 前端开发 JavaScript
css和html
【4月更文挑战第7天】css和html
12 0
|
16天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
28天前
|
前端开发 容器 内存技术
使用CSS3画出一个叮当猫HTML源码
本文教程介绍了如何使用CSS3绘制叮当猫,通过HTML结构和CSS样式逐步构建叮当猫的各个部位,如头部、脸部、脖子、身体、手脚等。代码示例展示了如何利用渐变、边框、阴影和定位技巧实现三维效果和细节特征。此外,还添加了眼珠的动画效果,让叮当猫的眼睛能够转动。整个过程适合对CSS3感兴趣的读者参考学习,以提升动态图形创作技能。
16 0
使用CSS3画出一个叮当猫HTML源码
|
1月前
使用html+css制作一个发光立方体特效
使用html+css制作一个发光立方体特效
20 2
使用html+css制作一个发光立方体特效
|
1月前
超简单的html+css魔幻霓虹灯文字特效
超简单的html+css魔幻霓虹灯文字特效
13 3
超简单的html+css魔幻霓虹灯文字特效
|
1月前
|
前端开发 JavaScript
从0到1:用HTML、CSS和JavaScript构建一个简单的待办事项列表
从0到1:用HTML、CSS和JavaScript构建一个简单的待办事项列表
26 0