这是网页的内容

这个页面在600秒之后自动跳转到哔哩哔哩官网首页

《静夜思》

床前明月光,疑是地上霜。

举头望明月,低头思故乡。

这是一级标签

这是二级标签

这是三级标签

这是四级标签

这是五级标签
这是六级标签

《爱莲说》

水陆草木之花,可爱者甚蕃。晋陶渊明独爱菊。自李唐来,世人甚爱牡丹。 予独爱莲之出淤泥而不染,濯清涟而不妖,中通外直,不蔓不枝,香远益清, 亭亭净植,可远观而不可亵玩焉。

予谓菊,花之隐逸者也;牡丹,花之富贵者也;莲,花之君子者也。噫! 菊之爱,陶后鲜有闻。莲之爱,同予者何人?牡丹之爱,宜乎众矣!

《寒食》

春城无处不飞花,寒食东风御柳斜。
日暮汉宫传蜡烛,轻烟散入五侯家。

这是普通文本

这是粗体文本
这是粗体文本

斜体文本

斜体文本
斜体文本

2处有上标标签:(a+b)2=a2+b2+2ab

2、4处有下标标签:H2SO4指的是硫酸分子

新鲜的新西兰奇异果

原价:¥6.50/kg

现在仅售:¥4.00/kg

学习是一件终身的事情。

普通字体文本

大号字体文本
小号字体文本

《春晓》

春眠不觉晓,处处闻啼鸟。


夜来风雨声,花落知多少。


我是一条水平线

《夜雨寄北》

君问归期未有期,巴山夜雨涨秋池。
何当共剪西窗烛,却话巴山夜雨时。


《相思》

红豆生南国,春来发几枝。
愿君多采撷,此物最想思。

一般标标签是一组开始符号和结束符号,
自闭合标签是无需配对的结束符号来结束。

p、hr、div等块元素独占一行(并不是在HTML代码里独占一行,
而是在浏览器显示效果中独占一行)

HTML元素的表现形式一般分为块元素(block)、行内元素(inline)
块元素在浏览器显示状态下占据一行,并排斥其他元素与其位于同一行。
一般,块元素内部可以容纳其他块元素和行内元素。

笨鸟blog

“笨鸟先飞,精卫填海”的精神

笨鸟blog “笨鸟先飞,精卫填海”的精神

行内元素可以与其他行内元素同行并容纳它们,但不能容纳块元素。

p标签的段落文字的“首行”不会缩进
空格键不能实现缩进,需要代码 
而一个汉字约等于3个" "

特殊符号:
注意:容易通过输入法输入的不必使用代码实现,
如:
双引号(英文):"
左单引号:‘
右单引号:’
乘号:×
大于号:>
小于号:<
“与”符号:&
长破折号:—
竖线:|
......
而输入法难以输入的,需要代码实现,
如:
分节符:§
版权符:©
注册商标:®
欧元:€
英镑:£
日元:¥
度:°
......



编程题成果一:

各科小常识

语文

       三国演义是中国四大古典名典名著之一,元末明初小说家罗贯中所著,是中国第一部章回体历史演义的小说,
描写了从东汉末年到西晋初年代近100年的历史风云。


数学

       勾股定理:a2+b2=c2


英语

       No painm,No gain.


化学

       H2SO4是一种重要的工业原料,可用于制作肥料、洗涤剂等。


经济

       版权符号:©
       注册商标:®




列表(数据排列方式)分为有序列表、无序列表和定义列表(有特殊含义)

  1. HTML
  2. CSS
  3. JavaScript
  4. jQuery
  5. Vue.js
  1. HTML
  2. CSS
  3. JavaScript
  4. jQuery
  5. Vue.js
  1. HTML
  2. CSS
  3. Javascript
  4. jQuery
  5. Vue.js
  1. HTML
  2. CSS
  3. JavaScript
  4. jQuery
  5. Vue.js
  1. HTML
  2. CSS
  3. JavaScript
  4. jQuery
  5. Vue.js
HTML:
制作网页的标准语言,控制网页的结构
CSS:
层叠样式表,控制网页的样式
JavaScript:
脚本语言,控制网页的行为

HTML语义化十分重要,即不能用div和span无语义应优先用其他有语义标签,
除了可读性,语义化对搜索引擎优化(即SEO)十分重要。
HTML的目的是在需要的地方使用对的语义化标签。




编程成果二:

问卷调查

1、你是通过什么途径来到笨鸟blog网的?

  1. 百度搜索
  2. 谷歌搜索
  3. 其它搜索

2、你觉得笨鸟blog网页面设计怎么样?

  1. 酷炫大方
  2. 比较普通
  3. 非常粗糙

3、你觉得这本书怎么样?(多选)




表格基本结构由表格table标签、表行tr标签和表行单元格td标签

HTML CSS
JavaScript jQuery

默认情况下,表格无边框,需要使用CSS加入边框。

表格完整结构还需在基本结构上加入caption、th等。

考试成绩表
小明 80 80 80
小红 90 90 90
小杰 100 100 100

默认情况下,表格无边框,需要使用CSS加入边框。

考试成绩表
姓名 语文 英语 数学
小明 80 80 80
小红 90 90 90
小杰 100 100 100

默认情况下,表格无边框,需要使用CSS加入边框。

表格语义化,结构更清晰,更具有可读性和可维护性。

考试成绩表
姓名 语文 英语 数学
小明 80 80 80
小红 90 90 90
小杰 100 100 100
平均 90 90 90

默认情况下,表格无边框,需要使用CSS加入边框。

姓名: 小明
喜欢水果: 苹果
香蕉

默认情况下,表格无边框,需要使用CSS加入边框。

前端开发技术
HTML CSS
JavaScript jQuery

默认情况下,表格无边框,需要使用CSS加入边框。




编程成果三:

学生成绩表
姓名 性别 成绩
张三 250
李四 520
平均分 385

默认情况下,表格无边框,需要使用CSS加入边框。





宝可梦
机器人
皮卡丘



编程成果四:

清晨
清晨
清晨



哔哩哔哩官网

鸟

中国大学MOOC官网

跳转到页面1
跳转到页面2

推荐文章
推荐音乐
推荐电影
......
......
......
......
......
......
......
......

推荐文章:

......
......
......
......
......
......
......
......

推荐音乐:

......
......
......
......
......
......
......
......

推荐电影:

  • 蜘蛛侠系列
  • 钢铁侠系列
  • 复仇者联盟




编程成果五:

永恒的爱
转到页面一





姓名:
姓名:
姓名:
姓名:
姓名:
姓名:

账号:
密码:

账号:
密码:

性别:

性别:

错误示范一:

性别:

错误示范二:

性别:

正确示范:

性别:
年龄: 80后 90后 00后

正确示范优化:

性别:
年龄:

复选框:








账号:
密码:

昵称:





个人简介:













编程成果六:

昵称:
密码:
邮箱:
性别:
个人简介:

上传个人照片: