HTML+CSS的分析总结

HTML+CSS的分析总结:

关于HTML:


一:HTML概括:全称为HyperText Markup Language,译为超文本标记语言,不是一种编程语言,是一种描述性的标记语言,html属于解释性语言。用于描述超文本中内容的显示方式,比如字体、图片的位置、颜色、大小等。

其基本的特点:简易性、可扩展性、平台无关性和通用性。目前制作网页用的最多的版本是HTML4.01和HTML5


二:HTML的编写工具及编码规范

1、编写工具:主要有windows记事本、EidtPlus、notepad++、DreamWeaver、sublime、webstrom等

2、编码规范:文件的后缀名为html或htm;HTML对大小写的区分不敏感

Html4.01版本的页面框架(sublime):

Html5版本的页面框架(sublime):


三:HTML主要的标签介绍

1:HTML的标签是由尖括号包围的关键字,如<html></html>;通常是成对出现,但也有单标签,如<hr>(水平线)


2:文件标记标签:<head>:文件头信息标记;<title>:页面标题信息标记; <body>:页面主题信息标记


3:字体标记标签:<STRONG> <B> :字体加粗;<I> <EM> <VAR> <CITE> <DFN> <ADDRESS> :字体添加斜体效果;<H1> <H2> <H3> <H4> <H5> <H6> :字体由 <H1> 至 <H6> 变粗变大加宽的程度逐渐减小;<FONT> <BASEFONT> :通过属性负责设置文字效果;


4:清单标记:<ul>为无须清单;<ol>为有序清单;<li>为清单的选项;其他的清单不推荐使用;


5:表格标记:<TABLE>:设置表格;<TR>:表示表格的列;<TD>:表示表格的格;<TH> :等价于<TD>,但是文字自动加粗,用于显示表格列明栏;<CAPTION> :表格标题列


6:表单标记:<FORM> :表单,用于数据提交;<INPUT> :输入框标记,种类分为Text、Radio、Checkbox、Password、Submit/Reset、Image、File、Hidden、Button;<SELECT> <OPTION> :下拉选单,select为选单对象,option为选项;<TEXTAREA> :文本输入域;


7:<A> :超链接标签;<IMG> :图片标记,插入图片

其中标签属性或样式的设置比较多,可以参考HTML的API文档



关于CSS:

一:概念:全称:Cascading Style Sheets;中文全称:层叠样式表;CSS目前最新版本为CSS3,是能够真正做到网页表现与内容分离的一种样式设计语言


二、样式表定义模式:

1、行内样式(位于html标签体内部的样式表现)

                       <div style="样式代码">其它标签文本内容</div> 不推荐使用主要使用后两种

2、内联样式(位于head标签内的样式表现)
                       <style type="text/css">样式代码</style>

3、外部样式(外部文件的样式表现)
                       <link href="样式文件url" rel="stylesheet" type="css/text"/>(样式文件后缀名.css


三、基本语法
CSS语法主要由三部分组成:选择器、属性和属性值:
                       exp: selector{property: value}
选择器:作用是关联样式和标签的操作
选择器的分类:
1、标签选择器:格式: 标签名{样式};多选择性:可以同时选择标签名相同的多个
2、class选择器:格式:.类名{样式};注意(类名前有个点同样具有多选择
3、id选择器:格式:#类名{样式}类名#不具有多选择性,id名不能重复
4、复合选择器:
      并集选择器:同时选中多个选择器的标签;格式:选择器1选择器2选择器3...{样式}选择器之间用逗号隔开
     后代选择器:根据父元素找到子元素的标签;格式:选择器1 选择器2 选择器3...{样式};父元素与子元素之间用空格隔开
     超链接选择器超链接默认效果a:link{样式}
                               鼠标移到上面的效果:a:hover{样式}
                               选择活动链接:a:active{样式}
                              访问过后的效果:a:visited{样式}
5、通用选择器:格式:*{样式}主要用于设置默认的样式

 对于样式属性的设置比较多,在这就不一一列举了,可以参考CSS的API文档








  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值