前端第一课

来源:互联网 发布:mayo clinic知乎 编辑:程序博客网 时间:2024/06/16 22:12

1.HTML:超文本标记语言

文件标记标签:headtitlebody

排版标记标签:pbrhrcenterdiv

字体标记标签:strongerbiuH1H2H3H4H5H6font

清单标记标签:olliuldldtdd

表格标记标签:tabletrtdth

表单标记标签:forminputselectoptiontextarea

框架标记标签:iframeframesetframe

超链接标签:a

其它标签:emberdimglinkmetamarquee

 

2.CSS:层叠样式表

CSS属性:

背景:background-colorbackground-imagebackground-repeatbackground-position:center

文本:text-indenttext-alignword-spacingletter-spacingtext-decorationcolordirectionline-height

字体:font-familyfont-sizefont-stylefont-weight

列表:list-stylelist-style-imagelist-style-type

内边距:padding-toppadding-rightpadding-bottompadding-left

外边距:margin-topmargin-rightmargin-bottommargin-left

边框:borderborder-styleborder-widthborder-color

定位: positiontoprightbottomleftoverflowz-indexfloat

尺寸:widthheightmax-heightmax-widthmin-heightmin-width

 

3.编程的规范性:

A.        统一用小写的字母、数字和下划线的组合(不得包含空格和特殊字符)

B.        首页统一取名为:index或者home,一般默认都是用index为首页命名

 

4.命名

放在页面首部的广告、装饰图等长方形大图取名:banner

标志性图片取名:log

有链接的图片取名:button

没有链接的标题图片取名:title

装饰用的照片取名:pic

在页面上连续出现、性质相同的栏目图片取名:menu

 

 

5.页面结构

容器框架 frame/container

页头 header

页尾 footer

内容框架 wrapper/content

侧栏 sidebar

 

 

6.导航结构

导航 nav

主导航 mainnav

子导航 subnav

顶导航 topnav

菜单 menu

子菜单 submenu

标题 title

图标 icon

 

 

7.功能结构

标志 logo

登陆 login

登陆条 loginbar

注册 regist

评论 review

子菜单 submenu

标题 title

图标 icon

按钮 button/btn

搜索 search

 

 

8.meta标签:用于定义文件头信息,告诉浏览器需要干一些什么事情

网页字符集:设置浏览器解释页面的字符内容

  格式:<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

自动跳转:设置网页过多久跳转到指定页面

   格式:<meta http-equiv="refresh" content="5;url=http://www.baidu.com">

keyword:设置搜索关键字内容,格式:<meta name="keywords" content="关键字内容"/>

description:设置描述关键内容,格式:<meta name="description" content="进行一些表述" />

author:设置网页作者,格式:<meta name="author" content="作者信息"/>

 

 

 

9.link引入css文件,格式:<link rel="stylesheet" type="text/css" href="路径">

   script引入js文件,格式: <script type="text/javascript" src="路径"></script>

 

 

 

10.空链接的两种设置模式

   <a href="#">撮我</a>:链接到当前页面

   <a href="javascript:void(null)">撮我</a>:空连接,不跳转到任何页面(推荐使用

 

 

11.兼容性是指硬件之间、软件之间或是软硬件组合系统之间的相互协调工作的程度。

 

 

 

12.判断IE浏览器版本方法

条件判断固定格式:<!--[if条件版本]>需要显示的内容<![endif]-->

排除条件:[if !IE 6] 除了IE6其他的都能显示

等于条件和或者条件:[if IE 8][if(IE 8)|(IE 10)]

高于版本和低于版本(不包含当前版本)[if gt IE 8]  [if lt IE 8]

高于版本和低于版本(包含当前版本)[if gte IE 8]  [if lte IE 8]

介于两个版本之间:[if(gt IE 7)&(lt IE 10)]

原创粉丝点击