380 likes | 673 Views
WEB 前端基础. 什么是前端. 前端是程序员. 前端是专注于界面开发的程序员. WWW 前端. WEB 前端的使命. 可访问性. 交互性. 专业性. 应该掌握什么. HTML+CSS+JS 的重要性. 如何掌握 HTML. 规范. 使用合适的标签. div h fieldset form dl ol ul p table. a br img input label select span strong textarea. 常用 HTML 元素. DOM 文档对象模型. 文档元素间关系.
E N D
div h fieldset form dl olul p table a brimg input label select span strong textarea 常用HTML元素
getElementById:根据指定的标签id值.来寻找标签元素.并返回对该标签的引用getElementById:根据指定的标签id值.来寻找标签元素.并返回对该标签的引用 getElementsByTagName:根据指定的标签名称,来获取网页中所有相同的标签元素.如:table,或div.则会找出网页中所有table元素,或所有div元素. 以一个类似数组的方式来返回对这些元素的引用. getElementsByName:根据指定的标签name值,来获取网页中所有的标签元素,并返回一个数组 createElement在网页中的创建一个标签元素 createTextNode创建一段文本内容 appendChild向网页中添加元素 removeChild删除元素的Dom 访问文档元素(部分)
语法简化 语义化标记 Form 表单增强功能 视频 / 音频 画布(Canvas) 可编辑内容 稳健的数据存储 HTML5特性
1. 影响文档流的属性(比如:display, position, float, clear, visibility, table-layout等) 2. 自身盒模型的属性(比如:width, height, margin, padding, border等) 3. 排版相关属性(比如:font, line-height, text-align, text-indent, vertical-align等等) 4. 装饰性属性(比如:color, background, opacity, cursor等) 5. 生成内容的属性(比如:content, list-style, quotes等) CSS书写顺序
* 元素的 style 样式属性,加 1,0,0,0。 * 每个 ID 选择符(#id),加 0,1,0,0。 * 每个 class 选择符(.class)、每个属性选择符(例 [attr=”"] )、每个伪类(例 :hover),加 0,0,1,0。 * 每个元素或伪元素(例 :firstchild)等,加 0,0,0,1。 * 其他选择符(例 全局选择符 *,子选择符 >),加 0,0,0,0。 CSS优先级:以 Specificity 的高低判断
8 圆角(边框半径) 9 边框图片 10 盒阴影 11 盒子大小 12 媒体查询 13 语音 1 选择器 2 RGBA和透明度 3 多栏布局 4 多背景图 5 Word Wrap 6 文字阴影 7 @font-face属性 CSS3 特性
Question hopesfish@163.com