怎么做自动提卡网站,舟山网络科技有限公司,深圳市住建局造价站,大学网站开发实验室建设方案目录 Web页面初步设计
标题字标记
基本语法#xff1a;
语法说明#xff1a; 添加空格与特殊符号
基本语法#xff1a;
语法说明:
特殊字符对应的代码:
代码解释#xff1a;
格式化文本标记
文本修饰标记
计算机输出标记 字体font标记
基本语法#xff1a;
属…目录 Web页面初步设计
标题字标记
基本语法
语法说明 添加空格与特殊符号
基本语法
语法说明:
特殊字符对应的代码:
代码解释
格式化文本标记
文本修饰标记
计算机输出标记 字体font标记
基本语法
属性说明 Web页面初步设计
Web 页面设计需要遵循简洁、一致性、有好的对比度的设计原则。简洁是指以满足们的实际需求为目标要求简练准确。一致性是指网站中各个页面使用相同的页边距页面中的每个元素与整个页面以及站点的色彩和风格保持一致。对比度的目的在于强调突出关键内容以吸引浏览者鼓励他们去发掘更深层次的内容。
标题字标记
标题子标记由h1~h6 共六种标记组成、标记中的字母h是英语 Heading 简称。作为标题字,h1标记定义最大的标题字,图3-1 添加文档内容h6 标记定义最小的标题字。h1标记到h6 标记属于块级标记它们必须在 HTML 中首尾成对出现。浏览器会自动地在标题的前后添加空行。
基本语法
h1 alignleft|center|right|justify1号标题文字/h1
字体最大默认对齐方式左对齐居中对齐。右对齐。
h2 alignleft|center|right|justify2号标题文字/h2
h3 alignleft|center|right|justify3号标题文字/h3
h4 alignleft|center|right|justify4号标题文字/h4
h5 alignleft|center|right|justify5号标题文字/h5
h6 alignleft|center|right|justify6号标题文字/h6
语法说明
h后面的数字越小标题字越大。标题字标记的 align属性用来定义标题字的对齐方式,对齐方式有四种分别是left、center、right、justify。但是一般推荐设计者使用 CSS 样式是都院是表来定义对齐方式。
例如
!doctype html
html langenheadmeta charsetUTF-8title标题字应用/title
/head
bodyh1 aligncenter jingyu飞鸟/h1h2 alignleft jingyu飞鸟/h2h3 aligncenter jingyu飞鸟/h3h4 alignright jingyu飞鸟/h4h5 alignjustify jingyu飞鸟/h5h6 aligncenter jingyu飞鸟/h6/body
/html代码解释 代码中第8行定义h1标题字居中显示;第9 行定义b2 标题字左对齐其余代码相似。标题文字的大小由它们的重要性决定等级越高的标题字号越大。在设计时要对各级标题有所规划。 添加空格与特殊符号
在HTML文件中添加空格的方式与其他文档添加空格的方式不同网页中通过代码控制来添加空格而在其他编辑器中通过键盘空格键来输入空格。
基本语法
bodynbsp;lt;reg;times;
/body
语法说明:
在网页中添加空格使用“nbsp;”其中“nbsp”是指Non BreakingSpace空格数量与“nbsp;”个数相同。在网页中插入特殊字符与插入空格符号的方式相同。
特殊字符对应的代码:
显示结果说明符号代码显示一个空格nbsp;小于lt;大于gt;符号amp;双引号quot;C版权copy;R注册商标reg;X乘号times; / 除号divide;
在 HTML 文件中特殊字符对应的代码浏览器解释后会显示对应的特殊符号。
例如
!doctype html
html langenheadmeta charsetUTF-8titilecsdn-jingyu飞鸟文章-插入特殊符号/titile/head
bodynbsp;nbsp;nbsp;nbsp;Web前端开发技术》,jingyu飞鸟欢迎您--等你轻牵我的手。醒来觉得甚是爱你。。brhr colorbluep aligncenter版权所有copy;csdn-jingyu飞鸟/p/body
/html代码解释
代码中第8行开始插入4个空格用于实现首行缩进2个字符行末插入br换行第 9 行插入蓝色的水平分隔线第10行插入版权特殊符号“copy;”。 格式化文本标记
HTML 中提供了很多格式化文本的标记如文字加粗、斜体、下画线、底纹、上下标等。
文本修饰标记
文本修饰标记各类浏览器均支持各类网页开发工具中仍然有这类标记。常见的文本修饰标记。
标记说明bjingyu飞鸟/b定义粗体。ijingyu飞鸟/i定义斜体。ujingyu飞鸟/u定义下画线deljingyu飞鸟/del定义删除线supjingyu飞鸟/sup定义上标subjingyu飞鸟/sub定义下标strongjingyu飞鸟/strong定义着重文字与b/b效果相同emjingyu飞鸟/em定义加重语气与i/i效果相同smalljingyu飞鸟/small变小字号bigjingyu飞鸟/big变大字号
计算机输出标记
(常用的引用和术语标记
标记主 要 用 途abbretc./abbr定义缩写address江苏南京市/address定义地址blockquote长的引用/blockquote定义长的引用cite引用、引证/cite定义引用、引证q引用短语/q定义短的引用语正看不到引号其余可以df定义项目/dfn定义一个定义项目
例如
!doctype html
html langen
headmeta charsetUTF-8title文本修饰标记应用/titlestyle typetext/css*{text-align:center;/*所有标记的内容居中显示*/}
/style
/head
body h3 aligncenter文本修饰标记应用/h3hr size2 colorredcomment修饰标记应用/commentbcsdn-jingyu飞鸟文章-文本修饰标记应用/bbricsdn-jingyu飞鸟文章-文本修饰标记应用/ibrucsdn-jingyu飞鸟文章-文本修饰标记应用/ubrdelcsdn-jingyu飞鸟文章-文本修饰标记应用/delbrXsup2/sup2X50brXsub1/sub2brsma11csdn-jingyu飞鸟文章-文本修饰标记应用/smal1brbigcsdn-jingyu飞鸟文章-文本修饰标记应用/bigbrstrong软件工程!/strongem软件工程!/em/body
/html上述代码中第 11 行是标题字标记的应用;第14行注释标记应用;第 14~23 行定义不同的文本修饰标记。 字体font标记
在不指定任何样式的情况下IE浏览器会把字体显示为3号、黑色、宋体。因此设计网页时根据需要更改不同段落的字体。HTML5 中可以使用CSS中的字体属性替代。font 标记规定文本的字体系列、字体尺寸、字体颜色所有浏览器均支持 font 标记。
基本语法
font face size color ……/font
属性说明
font 标记的属性、值
属性值说明size1~71~7-1~-7正数字越大字号越大负数字越大字号越小。“”表示字号比原来的字号大一些“-”表示字号比原来的字号小一些colorrgb (rg,b)rgb(r%,g%,b%)#rrggbb 或#rgb colorname规定文本的颜色。可以使用rgb 函数、土六进制数、颜色英文名称来表达face字体 1字体 2…字体nface 属性可以有多个值,用逗号分隔。字体使用方式为从左向右依次选用。如果前面的字体不存在则使用后一个字体。若都不存在则默认使用“宋体”
例如
!doctype html
html langen headmeta charsetUTF-8titlecsdn-jingyu飞鸟!文字样式/title/headbodystrong文字样式为黑体、颜色#000fff、大小从-1~-7:/strongfont face黑体size-1 color#000fff-1字/fontfont face黑体 size-3 color#000fff-3字/fontfont face黑体 size-5 color#000fff-5字/fontfont face黑体 size-7 color#000fff-7字/fontbrstrong文字样式为宋体、颜色#ff0066、大小从1~7:/strongfont face宋体size2color#ff00662子/fontfont face宋体 size4color#ff00664字/fontfont face宋体size6 color#ff00666字/fontstrong文字样式为隶书、颜色#ff0066、大小从1~7:/strongfont face黑体 size1color#f£00661字/fontfont face黑体 size3color#ff00663字/fontfont face黑体 size5color#ff00665字/fontfont face黑体 size7color#ff00667字/font/body
/html 代码解释
代码中第 9~12 行设置字体为“黑体、颜色为#000M、大小从-1~-7”;第:14~16行设置字体为“宋体、颜色为#0066、大小从 1~7”;第18~21 行设置字体为“黑体、颜色为#f0066、大小为1~7”。
