AY Asp.Net Core H5笔记1

栏目: ASP.NET · 发布时间: 5年前

内容简介:每天学2H web,2个月后做pc前端,手机app,处于.NET 尊重,我用core的web去测试了,不想用第三方文本编辑器,你以后vs code,hbuilder,webstorm,editplus,sublime啥的记事本也可以写,我使用Core2.1,当然这时候3.0也出来了,需要vs2019

每天学2H web,2个月后做pc前端,手机app,处于.NET 尊重,我用core的web去测试了,不想用第三方文本编辑器,你以后vs code,hbuilder,webstorm,editplus,sublime啥的

记事本也可以写,我使用Core2.1,当然这时候3.0也出来了,需要vs2019

AY Asp.Net Core H5笔记1

第一天AYH5STUDY_0307

建立空项目即可,不用docker,我自己玩,不https了。

AY Asp.Net Core H5笔记1

肯定先静态了,

右键

AY Asp.Net Core H5笔记1

默认结构

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>

</body>
</html>

默认输出helloworld的

AY Asp.Net Core H5笔记1

AY Asp.Net Core H5笔记1

增加一个Index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <h1>测试Index</h1>
</body>
</html>

当然放到外面是没有用的。要拖到wwwroot里面,你也可以直接右键wwwroot文件夹新建文件

AY Asp.Net Core H5笔记1

运行,此时默认是Index.html页面的

AY Asp.Net Core H5笔记1

增加一个JavaScript文件 1.js

var divxPos = 0;
window.onload = function () {
    runCode();
};
function runCode() {
    var test = document.getElementById("gogo");
    test.style.left = divxPos++ + 'px';
    setTimeout(() => runCode(), 50);
};
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="1.js"></script>
</head>
<body>
    <h1 id="gogo" style="position:absolute">测试Index</h1>
</body>
</html>

运行后,文字慢慢向右移动,因为left的属性越来越大

AY Asp.Net Core H5笔记1

如果想使用其他页面

Startup下的Configure可以修改为

 public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            DefaultFilesOptions options = new DefaultFilesOptions();
            options.DefaultFileNames.Clear();
            options.DefaultFileNames.Add("Index01.html");
            app.UseDefaultFiles(options);
            app.UseStaticFiles();
        }

AY Asp.Net Core H5笔记1

当然我们是学H5,这些不是重点,

H5+CSS3+Bootstrap4+vue+其他框架,可以做pc的web,可以做手机的app,可以做微信公众号等。

====================www.ayjs.net       杨洋    wpfui.com        ayui      ay  aaronyang=======请不要转载谢谢了。=========

介绍

支持

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

或者

<meta charset="utf-8" />

在vs2017中,输入html然后tab2下,就可以输出默认的html结构

输入html5然后tab2下,就是html5结构

不要在<html><head>和</head><body>和</body></html>中插入任何内容

写法不区分大小写。

验证规范: http://validator.w3.org

空元素,例如img只能<img />写法,不能<img></img>

area/base/br/col/command/embed/hr/img/input/keygen/link/mata/param/source/wbr

可以省略结束标签的

colgroup/dt/dd/li/optgroup/option/p/rt/rp/thhead/tbody/tfoot/tr/td/th

可以省略全部的, html head body colgroup tbody

例如

<!DOCTYPE html>
    <meta charset="utf-8" />
    <title></title>
    <h1>测试Index01</h1>

支持boolean的值属性

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <input checked type="checkbox" />
    <input readonly type="text" />
    <input disabled type="text" />
    <select style="width:100px">
        <option value="100"  selected >一百
        <option value="200"  >二百
    </select>
</body>
</html>

没用到后台代码的,不用F5重启解决方案,直接刷新浏览器就行了。

AY Asp.Net Core H5笔记1

你可以完全标准的去写 selected="true"

你也可以空值,空代表true

AY Asp.Net Core H5笔记1

如果属性名都不写,就代表false

还有些可以省略属性值的

checked , readonly, disabled,selected,defer,ismap,nohref,noshade,nowrap,multiple,noresize

有些值,还可以省略引号

比如<img src=ay.gif alt=ay2019>

还是建议使用双引号扩起来的,因为万一图片路径的某个文件夹名字有空格。

====================www.ayjs.net       杨洋    wpfui.com        ayui      ay  aaronyang=======请不要转载谢谢了。=========

推荐您阅读更多有关于“web前端,”的文章


以上所述就是小编给大家介绍的《AY Asp.Net Core H5笔记1》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

UNIX网络编程 卷1:套接字联网API(第3版)

UNIX网络编程 卷1:套接字联网API(第3版)

W.Richard Stevens、Bill Fenner、Andrew M. Rudoff / 杨继张 / 人民邮电出版社 / 2010-6 / 129.00元

这是一部传世之作!顶级网络编程专家Bill Fenner和Andrew M. Rudoff应邀执笔,对W. Richard Stevens的经典作品进行修订。书中吸纳了近几年网络技术的发展,增添了IPv6、SCTP协议和密钥管理套接字等内容,深入讨论了最新的关键标准、实现和技术。 书中的所有示例都是在UNIX系统上测试通过的真实的、可运行的代码,继承了Stevens一直强调的理念:“学习网络......一起来看看 《UNIX网络编程 卷1:套接字联网API(第3版)》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

随机密码生成器
随机密码生成器

多种字符组合密码