zoukankan      html  css  js  c++  java
  • !Web云笔记--HTML基础

    Web自学笔记第一阶段笔记综合汇总

    参考资料:《Head First HTML&CSS》(中文第二版)(美国)弗里昂ISBN9787508356464 中国电力出版社

    全部阶段:HTML基础àCSSà高级HTMLàJavaScriptàPHP脚本àWeb渗透

     

     

    Web学习笔记第一发:认识htmlweb语言

     

    强调,emphasize 大多数浏览器会把文本斜体,不重要不用记了

    Html文件里若干的空格和回车都被算作一个空格!!!想人为输入空格还得写实体,回车的话用

    浏览器会忽略html文档中 的制表符 回车和大量空格

     

     

    Html注释方法之一:

    块元素和内联元素

    第一发完------

     

     

     

    Web学习第二发:认识超文本

     

    注意,html语句一定要是英文标点符号!!!!!拒绝国产变态符号,具体参见《中英文常用符号对照表》

     

    安全第一:你可能看到web上有一些不严谨的html属性没有加双引号,不过你可不能偷懒,如果不严谨可能会导致很多问题

     

    文件系统可以看成是一个树根:和树相反,树根是朝下生长的,而且也无环(当然现实中的树根经常相互嫁接产生环路)所以我们今后将拿树根而不是树来比喻文件体统和一些子孙嵌套的系统。

     

    Href:引用的地址 reference

    相对地址与绝对地址

     

    左斜杠(右斜杠也叫反斜杠)最常用:http、文件系统、右标签等等,但是Windows特么的用反斜杠来表示文件体统

     

    两个点..代表上层文件夹,一个点.代表所在的文件夹

    题外话:linux中打开本目录下的文件可以写:./filename,即访问此文件夹下的某个文件

     

    ../../../..。。。上层上层上层。。。。

     

    Web页面与操作系统无关(相互独立)因为中间夹着浏览器,所以写web页面不必考虑OS的兼容性!!!!!!

     

    注意::网站文件名和文件夹名中不要使用空格!!!!!!!!!

     

    行业建议:最好在构建网站初期组织网站文件,这样就不用再网站升级时修改一大堆路径 了。

     

     

    相对路径就是:web文档所在文件夹(目录)为起点,去往寻找连接指向的文件。

     

     

    Web学习第三发:扩展词汇,一些标签

     

    Html语言线性扫描的时候只有三个特殊字符:小于号<</span>大于号>和与符号&。因为是从左到右线性扫描的,小于号大于号成对出现,与符号和分号;也成对出现,所以除了尖括号内的内容以及实体字符,其余的字符都视为文本字符串!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

     

     

     

    引用元素(quote)可能是搜索引擎的目标之一

     

    两种元素(标签):正常元素和void(空)元素,前者指成对出现的元素,后者是单着的,如
    !Web云笔记--HTML基础

     

    有序列表元素的好处:自动编号,否则想改变顺序或者增删新列表项就要人为重写序号,太麻烦

     

    列表元素只能包含

     

    实体:<</span>;是<(less than)  >>(greater than)  &&自己(ampersand=and

    http://www.unicode.org/charts/获得详细的特殊字符实体表示法、

    就像程序语言中的转义字符,也需要一个转义字符来表示自己

    Html中的实体字符的目的:用有限的ascii字符来表示海量的unicode字符!!

     

    既可以是内联元素也可以是块元素!!!!

    !Web云笔记--HTML基础inline元素


    既不是内联元素也不是块元素。。。

     

     

     

     

     

     

    第四发:进军http

     

    找一家托管公司(租一台服务器)/购买一台服务器(购买域名)/搭建localhost(仅供测试)

     

    ICANN域名管理机构

     

    www其实是域中服务器的名字

    Starbucks.com才是域名

    二者合起来叫网站名:域名可以用于多个网站

     

    ftp图形化软件:比如百度网盘客户端。。。

    ftp命令行:cdputmkdirdirpwdget。。。。同DOSlinux等操作系统

     

    SFTPsecure FTP

     

    强烈推荐Dreamweaver!!!!!!!!!

     

    url的组成:

    第一部分:协议名,比如httpftp

    第二部分:服务器名:比如www

    第三部分:域名

    第四部分:绝对路径

    第五部分:(其他内容)

     

    科普:什么是协议,只有在多台智能设备之间才叫协议,如交换机路由器、pc与服务器

     

    绝对路径就是出发点为根目录的路径,以/开头,/代表根

     

    单机一个相对路径链接时,浏览器会生成一个绝对路径发出去(url

     

    默认html文件是index.htmldefaut.html

     

    使用相对路径的好处:一来节省墨水,二来当网站位置移动或者改名不用一一修改路径

     

    从本机读取文件file:///有三条杠。。。因为中间网站名的位置为空!!!

     

    Web默认端口:80

     

    中的title属性:覆盖所链接网页的

    中的中的内容!!!!!

     

    行业建议:不要把链接放在一起,不然用户很难发现!!!!

     

    元素创建id属性:跳转到页面特定位置(也可以是本页面)!!!!!!!!!!!!!!!

     

    Id的唯一性:同一页面值唯一;统一元素种类唯一!!

     

    元素属性的顺序随便:排名不分先后

     

    可以为任何元素增加title属性!!!!(用于提示)

     

    Id一定要字母开头?!后面可以是字母、数字、减号、下划线、冒号、点号,不能有空格!!!

     

    target属性:

    “_blank”在新窗口(标签页)打开

    “_parent”:????

    新名字:所有目标为它的网页都会在同一新窗口打开(覆盖)

     

     

     

    第五发:!Web云笔记--HTML基础

     

    浏览器获取图片滞后于html

    浏览器也可以设置为不获取图片!

     

    Web上常用格式:jpeg png gif

     

    Jpeg

    连续色调如照片

    256^3=1600多种颜色

    有损压缩

    文件较小

     

    Png

    单色图像线条图像如logo和小文本

    上百万种颜色png-8 png-16 png-32

    无损压缩优于gif

    支持透明比gif更高级

    比相应jpeg文件较大

     

    Gif

    单色线条图像

    256中颜色

    无损

    支持透明

    比相应jpeg

    支持动画

     

     

    Alt属性:图片显示不出来时显示的文本

     

    一英尺=30.48cm

    一英寸=2.54cm

     

    浏览器的auto image resize功能

     

    强烈推荐Photoshop ,有专门为web图片服务的存储选项

     

    Href可以直接链接到图片文件!!!

     

    边缘柔化:!!!!!!!!!!!!

    针对小文本或者矢量logo

    栅格化成位图后放大会产生锯齿

    抗锯齿就是在周边覆上一层相对于背景的渐变色

    所以如果背景透明的话,就要将柔滑边缘设置成对应理想的背景色

     

    行业经验:图片宽度少于800px

     

    第六发:html标准

     

    !!!

    标准html(5)不用再考虑版本号,html变成一个活的标准,版本的概念被淡化,继续根据需要发展和变化,向下兼容:向html添加新内容,支持原来的内容

     

    W3c验证工具

    http://validator.w3.org

     

    题外话:什么是编码:编码是程序语言和底层二进制之间的桥梁

     

    放到

    中第一个位置

     

    只有

    能直接放在中!!!!

     

    -----------------------------------------------------------------------------

  • 相关阅读:
    游戏开发设计模式之子类沙盒模式(unity3d 示例实现)
    Unity3d 屏幕空间人体皮肤知觉渲染&次表面散射Screen-Space Perceptual Rendering & Subsurface Scattering of Human Skin
    Unity5 Screen-Space Subsurface Scattering屏幕空间次表面散射SSSSS
    游戏开发Camera之Cinematic Camera-深度
    这次GDC China 2015的总结与关卡设计教程的梳理
    游戏开发设计模式之状态模式 & 有限状态机 & c#委托事件(unity3d 示例实现)
    游戏开发设计模式之原型模式 & unity3d JSON的使用(unity3d 示例实现)
    MyBatis结果集一对多映射
    Builder模式实例 MyBatis的ResultMapping和ResultMap
    MyBatis PropertyTokenizer
  • 原文地址:https://www.cnblogs.com/jinhengyu/p/7516890.html
Copyright © 2011-2022 走看看