HTML+CSS培训教案
关注
分享
扫一扫
我在2017年给学弟学妹们网络授课的教案（一边讲一边写的）。转载请标明出处。
主教材：《HTML+CSS网页设计与布局从入门到精通》，温谦编著. 北京：人民邮电出版社
红壶吃猬队
刚刚入行的PHP程序员，熟悉Laravel和ThinkPHP框架。石家庄Linux用户组（SJZLUG）群（群号：249872047）管理员。
展开
-
HTML+CSS培训教案（十六）
三十六、表单代码<html> <head> <meta content="text/html;charset=utf-8"> <title>美化表格</title> <style> </style> </head> ...原创 2019-06-16 21:00:08 · 270 阅读 · 0 评论 -
HTML+CSS培训教案（十五）
三十四、美化表格代码<html> <head> <meta content="text/html;charset=utf-8"> <title>美化表格</title> <style> tbody tr{background-color: #c...原创 2019-06-16 20:59:17 · 240 阅读 · 0 评论 -
HTML+CSS培训教案（十四）
三十二、父子块代码<html> <head> <meta content="text/html;charset=utf-8"> <title>父子块</title> <style> div.father{ background-...原创 2019-06-16 20:58:26 · 388 阅读 · 0 评论 -
HTML+CSS培训教案（十三）
三十、块级元素和行内元素代码（事先将一张图片（.jpg、.png均可）放入网页的同级目录下）<html> <head> <meta content="text/html;charset=utf-8"> <title>块级元素和行内元素</title> <style>...原创 2019-06-16 20:57:41 · 166 阅读 · 0 评论 -
HTML+CSS培训教案（十二）
二十七、盒子代码<html> <head> <meta content="text/html;charset=utf-8"> <title>盒子</title> <style> div{background:#CCC;border-color:#00F...原创 2019-04-21 16:26:42 · 249 阅读 · 0 评论 -
HTML+CSS培训教案（十一）
二十六、文字样式与排版font-family：文字字体Arial,“Times New Roman”——使用Arial字体，若不存在则找Times New Roman字体font-style：倾斜效果(1)normal(default)：不倾斜（默认选项）(2)oblique：物理右倾15度(3)italic：使用斜体字体库font-weight：加粗效果(1)normal(de...原创 2019-04-21 16:25:56 · 309 阅读 · 0 评论 -
HTML+CSS培训教案（十）
二十二、复合选择器代码<html> <head> <meta content="text/html;charset=utf-8"> <title>复合选择器</title> <style> h3.spe{color:red;} h3,s...原创 2019-04-21 16:24:30 · 223 阅读 · 0 评论 -
HTML+CSS培训教案（九）
十九、引入CSS样式代码（事先在同级目录下创建19.html和19.css）[19.html]<html> <head> <meta content="text/html;charset=utf-8"> <title>三大选择器</title> <link rel="s...原创 2019-04-21 16:23:29 · 215 阅读 · 0 评论 -
HTML+CSS培训教案（八）
十七、HTML基本知识发展历史XHTML规范必须严格遵守：(1)名称小写；(2)严格嵌套；(3)标记封闭；(4)双引号扩住；(5)属性值完整CSS：层叠样式表，代替HTML执行样式功能十八、选择器对象/类。根据一类东西设置属性选择器种类：标记、类、id代码<html> <head> <meta content="text...原创 2019-03-27 20:41:18 · 230 阅读 · 0 评论 -
HTML+CSS培训教案（七）
十五、表格（三）代码<html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>单元格对齐</title> </head> <body> ...原创 2019-03-27 20:40:03 · 625 阅读 · 3 评论 -
HTML+CSS培训教案（六）
十三、表格（一）代码<html> <head> <meta content="text/html;charset=utf-8"> <title>表格</title> </head> <body> <table> ...原创 2019-03-27 20:38:28 · 232 阅读 · 0 评论 -
HTML+CSS培训教案（五）
十一、锚链接代码<html> <head> <meta content="text/html;charset=utf-8"> <title>锚链接</title> </head> <body> <a href="#first">...原创 2019-03-27 20:36:04 · 269 阅读 · 0 评论 -
HTML+CSS培训教案（四）
九、路径绝对路径：从磁盘或网站目录自顶向下寻径。相对路径：从当前目录先上后下寻径当前目录：当前文件所在的文件夹先上：找到欲找寻资源的同级目录后下：由同级目录寻找资源如图。由给定目录，从a.html中引入A.jpg图片初始：/root/f01向上：/root向下到01：/root/f02/01引入：/root/f02/01/A.jpg练习所在文件引入资源...原创 2019-02-28 07:47:37 · 215 阅读 · 0 评论 -
HTML+CSS培训教案（三）
六、图片代码（事先将一张图片（.jpg、.png均可）放入网页的统计目录下）<html> <head> <meta content="text/html;charset=utf-8"> <!-- 这里省略标题 --> </head> <body bgcolor="g原创 2019-02-28 07:46:56 · 338 阅读 · 0 评论 -
HTML+CSS培训教案（二）
三、标题和字体代码&lt;html&gt; &lt;head&gt; &lt;meta content="text/html;charset=utf-8"&gt; &lt;title&gt;标题标记&lt;/title&gt; &lt;/head&原创 2019-02-28 07:45:56 · 327 阅读 · 0 评论 -
HTML+CSS培训教案（一）
一、基本知识HTML：超文本标记语言。该语言由标记对组成，不存在编译错误问题基本语法：<标记>内容</标记>网页扩展名：.html、.htm编辑工具：记事本、DW、Eclipse查看源文件【chrome】右击->查看源、Ctrl + u二、网页雏形代码<html> <head> <meta c...原创 2019-02-28 07:44:59 · 1336 阅读 · 0 评论