计算机基础知识+web全栈+网页

网页切图过程中div+css命名规则

1.windows常用快捷键

ctrl+c 复制      ctrl+v粘贴      ctrl+x 剪贴       ctrl+s 保存      alt+tab切换应用程序       windows+d 返回桌面       windows+e 打开本地磁盘      F2 重命名      F5 刷新      ctrl+n 新建       ctrl+o 打开       ctrl+z 撤销       ctrl+f 查找       ctrl+a 全选       
alt+F4 关闭当前程序       windows+m 小化所有窗口       
windows+f 查找文件        Windows+f1 显示windows帮助        windows+r 开始“运行”        windows+l 切换使用者
      

2.web全栈工程师

（1）认识大前端

pc端页面 、移动端页面
学习方式：培养学习能力、自控能力、做好吃苦准备

（2）认识网页

网页由文字、图片、超链接、视频、音频、按钮等元素
文字、图片、超链接为最基本的元素
实现技术： html+css+js
html————结构（骨骼）
css————表现（美化师）
js————行为（灵魂）

（3）浏览器的那些事

浏览器：浏览网页的应用软件
朱啊哟浏览器： IE、chrome、firFox、safari、oprea、trident、blik、gecko、weblit、presto、
推荐使用谷歌。

（4）浏览器与服务器之间的那点事

https://------------------------------------ 文件加密传输

web全栈工程师的价值

技术有两个发展方向，一种是纵向一种是横向的，横向的是瑞士军刀，纵向的是削铁如泥的干将莫邪。这两个方向都没有对与错，发展到一定程度都会相互溶合，就好比中国佛家禅修的南顿北渐，其实到了最后，渐悟与顿悟是一样的，顿由渐中来。可以说全栈什么都会，但又什么都不会。
如果一个公司不太懂全栈工程师的价值，那么全栈工程师的地位将会很尴尬，说得不好听一点，全栈工程师就是什么都会，什么都不会。曾经有一次面试，对方问很基础的问题，他答不上来，但他能做出产品，也知道什么是怎么一回事，他也不会犯那些错误，可他就是答不上概念，要考倒他非常容易。所以在应聘面试的时候，有些时候会吃亏，他可能会不如那些在某一方面钻得很深的人工资拿得高。
由于经常在各种技术穿梭，他会经常忘记代码的语法和一些API，所以他经常需要去查API甚至查语法，他觉得没有Google我几乎没法工作。这在某些人的眼里，是技术不够的表现。他记的只是一个Key，一个如何找寻答案的索引，而不是全部，人脑不是电脑，他不可能能记下所有的东西。

网页切图过程中div+css命名规则

(一)命名规则

内容：content/container 导航：nav 侧栏：sidebar 　 　
栏目：column 标志：logo 页面主体：main 　　
广告：banner 热点：hot 新闻：news
下载：download 子导航：subnav 菜单：menu
搜索：search 页脚：footer 滚动：scroll
版权：copyright 友情链接：friendlink 子菜单：submenu
内容：content 标签页：tab 文章列表：list
注册：regsiter 提示信息：msg 小技巧：tips
加入：joinus 栏目标题：title 指南：guild
服务：service 状态：status 投票：vote
尾：footer 合作伙伴：partner 登录条：loginbar
页面外围控制整体布局宽度：wrapper 左右中：left right center

(二)注释的写法:

/* Footer /
内容区
/ End Footer */

(三)id的命名:

(1)页面结构

容器: container 页头：header 内容：content/container
页面主体：main 页尾：footer 导航：nav
侧栏：sidebar 栏目：column 左右中：left right center
页面外围控制整体布局宽度：wrapper

(2)导航

导航：nav
主导航：mainbav
子导航：subnav
顶导航：topnav
边导航：sidebar
左导航：leftsidebar
右导航：rightsidebar
菜单：menu 子菜单：submenu 标题: title 摘要: summary

(3)功能

标志：logo
广告：banner
登陆：login
登录条：loginbar
注册：regsiter
搜索：search
功能区：shop
标题：title
加入：joinus
状态：status
按钮：btn
滚动：scroll
标签页：tab
文章列表：list
提示信息：msg
当前的: current
小技巧：tips
图标: icon
注释：note
指南：guild
服务：service
热点：hot
新闻：news
下载：download
投票：vote
合作伙伴：partner
友情链接：link
版权：copyright

(四)class的命名:

(1)颜色:使用颜色的名称或者16进制代码,如

.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }

(2)字体大小,直接使用"font+字体大小"作为名称,如

.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; }

(3)对齐样式,使用对齐目标的英文名称,如

.left { float:left; }
.bottom { float:bottom; }

(4)标题栏样式,使用"类别+功能"的方式命名,如

.barnews { }
.barproduct { }

注意事项:

1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写，除非一看就明白的单词.
主要的 master.css 模块 module.css 基本共用 base.css
主题 themes.css 专栏 columns.css 打印 print.css
文字 font.css 表单 forms.css 补丁 mend.css
布局，版面 layout.css