页面布局 | 易学教程

两个常规的页面布局方式

阅读更多关于两个常规的页面布局方式

表格布局 html: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>表格布局</title> <link rel="stylesheet" type="text/css" href="css/bgStyle.css" /> </head> <body> <header></header> <nav></nav> <div class="content"> <div class="tablecontent"> <div class="tablerow"> <section id="left"> 杂乱无章 </section> <section id="main"> 杂乱无章 </section> <aside id="right"> 杂乱无章 </aside> </div> </div> </div> <div class="foot"> <footer></footer> </div> </body> </html> css: * { margin: 0px; padding: 0px; } html, body { height: 100%; overflow: hidden; background-color: gray; } header { height: 100px; background

前端开发（一）HTML

阅读更多关于前端开发（一）HTML

1、前端概述前端开发：基于web的互联网产品的界面开发及功能开发。互联网产品开发流程及岗位： HTML是 HyperText Mark-up Language 的首字母简写，意思是超文本标记语言 <!DOCTYPE html> <html lang="en"> <head> <title>个人主页</title> <meta charset="utf-8"> </head> <body> 这是我的个人主页 </body> </html> “<html>”标签中的‘lang=“en”’定义网页的语言为英文，定义成中文是'lang="zh-CN"',不定义也没什么影响，它一般作为分析统计用。 2、HTML文档类型（1）xhtml 1.0 xhtml 1.0 是html5之前的一个常用的版本，目前许多网站仍然使用此版本。用sublime text创建方法： html:xt + tab <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http

PC端页面布局

阅读更多关于 PC端页面布局

1. a标签与4个伪类 :link 选择所有未访问的链接(没有被点击过的链接) ； :visited 选择已经被访问过的链接； :hover 设置鼠标悬停时的链接样式； :active 选择所有激活的链接(正在被点击的链接)；注意： :hover 必须在 :link 和 :visited 后定义才能有效！ :active 必须在 :hover 后定义才能有效. 伪类名称不区分大小写。 2. 选择器分类 1.通配符选择器 *：选择所有的元素 ; 2.元素选择器：直接使用标签名进行选择元素 ; 3.类选择器：类选择器使用英文字符“.”后加HTML元素的class属性来选择特定元素 ; 类名不能以数字开头 HTML元素也可以引用多个类。用空格隔开。4. id选择器：id选择器使用英文字符“#”后加HTML元素的id属性来选择特定元素。5.伪类选择器 :link ：设置所有未访问过的链接的样式 :visited ：设置所有访问过的链接的样式 :hover ：设置鼠标悬停时的样式 :active：设置正在被点击链接的样式；注意: a：hover 必须在 a：link 和 a：visited 后定义才能有效！ a:active 必须在 a:hover 后定义才能有效. 伪类名称不区分大小写。6.群组选择器：为了简化代码，将具有相同样式的选择器组合在一起，用“，