认识HTML与CSS

W3C标准
World Wide Web Consortium，万维网联盟
规范
1、标签名称、属性名称必须小写时
2、标签必须严格嵌套，并且必须闭合，即使空元素标签也必须闭合
3、属性值必须用引号引起来

本课目标
掌握HTML标签的应用
掌握CSS的语法结构和在网页中的应用
掌握CSS的语法结构

什么是HTML？
HTML：超文本标记语言（Hyper Text Markup Language）
HTML不是一种编程语言，而是一种标记语言，描述网页的语言
HTML使用标签描述网页中图片、文本、音乐、视频、超链接等

HTML5是什么？
1、字面意义上：HTML技术标准的第5版；
2、广义上是HTML、CSS等的组合；
3、更简单代码创建功能强大的程序，书写更简洁的html代码；
总结：本门课程使用HTML5的网页结构讲解基础的HTML和CSS。
网页结构
讲解HTML5的网页结构，标签<html>、<head>、<title>、<body>的含义，<!doctype>声明、charset网页字符编码；
HTML基本标签
标题标签 <h1>~<h6>
段落和换行标签 <p>…</p>、<br/>
水平线标签 <hr/>
斜体 <em>…</em>
字体加粗 <strong>…</strong>

什么是CSS以及CSS的优势！
CSS
层叠样式表（CascadingStyle Sheet）
CSS的优势
1、内容与表现分离
2、网页的表现统一，容易修改
3、丰富的样式，使页面布局更加灵活
4、减少网页的代码量，增加网页的浏览速度，节省网络带宽
5、运用独立于页面的CSS，有利于网页被搜索引擎收录
CSS语法示例
选择器 { 声明1; h1{
声明2; font-size:12px;
声明3; color:red;
…… }
}
选择器的区别
1、标签选择器 p{font-size:16px;color:red;}
2、类选择器 .second{font-size:20px;color:#096;}
3、ID选择器 #third{font-size:24px;color:black;}

相对路径
绝对路径：从盘符出发
相对路劲：相对项目文件路径出发

代码示例

<!DOCTYPE html> <%--        文档类型声明--%>
<html><head><meta charset="UTF-8"><title>第一个网页</title></head><style>/*style样式*/</style><body><h1>大河之剑天上来</h1></body>
</html>

认识HTML与CSS相关推荐

ireport如何给static text加边框_html amp;amp; css 解决li浮动边框为2的问题
html && css 解决li浮动边框为2的问题思路问题:首先,li 浮动后,添加边框,则中间 li 的边框会形成 1+1=2 的效果,1px的边框会变成2px.(例:分页模块 ...
【css】基础学习总结
填充部分: 1.css概念 2.如何用css控制页面样式(2种方式,写在页面内,链接CSS样式文件) 3.介绍了不同的选择器(3种) 4.选择器的声明:集体,嵌套 5.css继承:父子嵌套继承 6.C ...
Conversion error:Jekyll::Converters::Scss encountered an error while converting css/main.scss
错误描述:Conversion error: Jekyll::Converters::Scss encountered an error while converting 'css/main.scss ...
CSS 选择器：BeautifulSoup4解析器
和 lxml 一样,Beautiful Soup 也是一个HTML/XML的解析器,主要的功能也是如何解析和提取 HTML/XML 数据. lxml 只会局部遍历,而Beautiful Soup 是基 ...
CSS Modules
css-loader 提供了一种叫做 CSS Modules 的方案,可以帮我们自动生成唯一的类名,不会和其他模块的命名出现冲突要使用 CSS Modules 有几个步骤,首先需要在 webpack ...
css 伪元素::after与::before的使用
CSS伪元素是用来添加一些选择器的特殊效果. 一般使用是类或者id::after , 类或者id::before ::after是在类的后面处理逻辑 ::before 是在先的前面处理逻辑它们都 ...
前端之css基础学习（更正版）
css是什么 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离. 简单的说css的引入就是为了使得HTML语言能够 ...
div css 常用技巧
div css 常用技巧 1.给图片加上alt属性: <img src="logo.gif" alt="我的公司logo,点击返回首页" /> 2 ...
CSS单位分析及CSS颜色表示法、颜色表（调色板）
CSS单位主要分析em.rem.fr这三个较难理解的单位吧,平常的px.%.cm那些就不谈了嘛. px在不同场景之下为同样的值,我们把它称作绝对单位,而em和rem受外部因素的影响下而改变,因此称作相 ...
前端之css引入方式/长度及颜色单位/常用样式
1.css三种引入方式 <!DOCTYPE html><html><head> <meta charset="UTF-8"> < ...

认识HTML与CSS

认识HTML与CSS相关推荐

最新文章

热门文章