HTML-曹老师视频笔记-2018.07.09 - 草稿

视频笔记

HTML:超文本标记语言

双标签:

  1. <html></html>:超文本标签,规定了在标签内的文本为超文本。
  2. <head></head>:网页头标签,用来定义网页头。
  3. <title></title>:网页标题标签,用来定义网页标题。
  4. <body></body>:网页主题标签,网页内容全部包含在body内。
  • 属性:bgcolor="背景颜色(英语/#6位16进制数#RGB)"
    六位数,两位表示一个颜色,R代表red红色;G代表green绿色;B代表blue蓝色。
    一般表示00~FF 不同的值代表的是不同的颜色配比。
    例如:#FF0000 代表红色为F,绿色为0,蓝色为0
    和 #00FF00 代表绿色;#0000FF 代表蓝色
    使用工具:
    1.在线颜色选择器
    2.RGM颜色查询对照表
    backgroung="背景图片"
<body bgcolor="#0000FF" backgroung="abc.jpg">
</body>

结果显示:


图片设为背景色的实际情况

设置为页面背景颜色为蓝色,背景图片为abc.jpg,此时图片为多个图片平铺在页面上。如果想一张图片平铺在背景页面上,需要将body加上style属性。

<body background="div-1-1.png"   style=" background-repeat:no-repeat ;background-size:100% 100%;  background-attachment: fixed;" 
> 
</body> 

结果显示:

设置100%之后的实际情况

实验结论:如果全部设置为100%图片的画面会被改变,这需要一定的图片大小,足够支撑整个页面。背景size是可以改变大小的,用百分比进行调节就可以。

  1. <h1></h1>~<h6></h6> 标题标签
  2. <font> </font> 字体标签

属性: size(字体大小);color(字体颜色);face(字体类型)
查看字体类型方法:个性化设置-控制面板-字体
打开后里面显示很多很多字体,可以输入中文英文进行切换的变化。

一些特殊符号:用&进行编写
例如:
空格(&nbsp)
双引号(&quot)(“”)
小于号(&lt)(<)
大于号(&gt)(>)
版权号(&copy)(©)

工具:HTML特殊符号速查表

  1. <p></p>段落标签
    属性:align 对齐(正常默认左对齐)
    <p align="right"> 右对齐</p>
    <p align="center"> j居中</p>
    <p align="left"> 左对齐</p>
  2. <ul></ul> 无序标签; <ol> </ol> 有序标签;<li></li>列表项

属性:
type“列表样式”
start 列表起始值
有序列表中:
type="A" 代表英文大写,
type="a" 代表英文小写,
type="Ⅰ"代表罗马数字大写,
type="ⅰ"罗马数字小写
type="1"阿拉伯数字(默认)
无序列表中属性:
type="square" 方格黑色
type="cycle" 黑色圆点
type="circle"空心圆圈
type="dise"默认格式(黑色圆点)

 <ol start="4" type="A">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
  </ol>

显示如图:


有序列表从英文字母第四项D开始的英文大写序号标签
 <ul start="4" type="circle">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
  </ul>

图像显示:


空心圆圈无序列表
  <ul start="4" type="disc">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
  </ul>

图像显示:


disc无序列表
<ul start="4" type="square">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
  </ul>

图片显示:


square无序列表显示
  <ul start="4" type="disc">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
  </ul>

图片显示:


默认无序列表

单标签:

  1. 换行标签
  2. 图像标签

属性 :
src(source)
width(宽)
height(高)
alt(图片不显示时候的文字)
title(光标处显示内容)
align(代表图片后面的文字的对齐方式,top,middle,buttom)

关于p标签和img标签中align的对比
<img>中代表图像后面文字的对齐方式
<p>标签中代表段落的位置


  1. 分割线标签

属性:
color(颜色)
width(宽 用px像素或者百分比表示)
size(粗细)px 关于size不同浏览器显示不同,搜狐浏览器显示的分割线就有圆弧,别的浏览器就是长条的。

关于width中像素px和百分比的区别
1.首先建议用百分比,因为会随着浏览器对话框的大小进行调整
2.百分比一直都是居中显示,比较方便,而像素px显示不会变化。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,793评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,567评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,342评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,825评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,814评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,680评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,033评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,687评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,175评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,668评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,775评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,419评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,020评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,206评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,092评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,510评论 2 343

推荐阅读更多精彩内容

  • 视频笔记 HTML:超文本标记语言 双标签: :超文本标签,规定了在标签内的文本为超文本。 :网页头标签,用来定义...
    侯小强2018阅读 519评论 1 0
  • 一,HTML语言的一般语法: 1,围堵标记:<>… 1)带属性的标记: … 2)无属性的标记:加粗 居中 标题 2...
    清水易蓝阅读 1,259评论 0 2
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 6,304评论 2 66
  • 概述 在网易云课堂学习李南江老师的《从零玩转HTML5前端+跨平台开发》时,所整理的笔记。笔记内容为根据个人需求所...
    墨荀阅读 2,331评论 0 7
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    程序员poetry阅读 16,512评论 32 459