热搜:NVER node 开发 php

HTML、XHTML、css速记_html/css_WEB-ITnose

2024-11-19 19:45:01
HTML、XHTML、css速记_html/css_WEB-ITnose

一、HTML

以下内容记录常用的html元素,可另存为html文件以查看效果:

 

 

 

 

 

 

 

 

HTML Demo

 

 

       

h1?h6定义标题

       

p标记定义段落,浏览器显示时会自动换行

       
(换行)

       


(分割线)

       

原始样式输出,比如保留空   格  

                换行

                       及缩进

        加强显示,类似粗体文字

        斜体文字

        粗体文字

 

        文字链接

       

        定义页面的书签(位置)

        跳转到那个书签(位置)

 

       

                   

  • 无序号列表-条目1
  •                

  • 无序号列表-条目2
  •        

 

       

                   

  1. 有序号列表-条目A
  2.                

  3. 有序号列表-条目B
  4.        

 

       

               

自定义列表项目1

                      

条目1-1

                      

条目1-2

               

自定义列表项目2

                      

条目2-1

                      

条目2-2

       

 

       

               

                 

               

               

                 

                 

               

               

                 

                 

               

       

表格标题行
一行第1列 一行第2列
二行第1列 二行第2列

 

       

div是区块/小节 定义,浏览器显示时会自动换行。section、div、header、footer等标签通常用于页面布局。class、id可以为外部样式表预设标识

       

段内布局元素,可使用css单独对此部分文字进行修饰

 

       

               

               

                Married

                Male

                Female

               

               

                      

                      

                      

               

               

               

               

               

       

 

 

以下是html框架(frame)示例??由于frame实际上是多个文件的组合,所以在执行脚本、页面刷新等操作时往往出现意外结果,现在用的不多。大部分网站采用div区块布局达到类似的“排版”效果。

 

 

Frame Demo

 

 

       

       

               

               

       

 

 

二、XHTML

XHTML 指的是可扩展超文本标记语言;XHTML 与 HTML 4.01 几乎是相同;XHTML 是更严格更纯净的HTML 版本;XHTML 是以 XML 应用的方式定义的 HTML;XHTML 是 W3C 推荐标准。

根据以上定义,可以看出xhtml和普通html区别仅在于格式更规范。

例如:

必需拥有根元素()

元素必须正确嵌套

元素必须始终关闭

元素、属性必须小写

属性值必须用引号、不能简写

三、css

css(层叠样式表)用于在分离的文件中对html内容进行外观修饰。提供了丰富的功能以满足多种视觉效果。css最基本格式为:选择器{属性:值;属性:值;......}

如:h1 {color:red;font-size:10px}

div.main,span#important{color:green}

body table {font-size:10px}

总结:html/xhtml、css、javascript是很自然的mvc架构,html是内容;css是展示;javascript是控制,这也是目前网站所用的主流技术组合,很多前端技术框架也是基于三者来完成的。