AY Asp.Net Core H5笔记1

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

内容简介：每天学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

增加一个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=======请不要转载谢谢了。=========

介绍

支持

或者

在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》，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对码农网的支持！

查看所有标签

猜你喜欢:

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

码农书籍

The Cult of the Amateur

Andrew Keen / Crown Business / 2007-6-5 / USD 22.95

Amateur hour has arrived, and the audience is running the show In a hard-hitting and provocative polemic, Silicon Valley insider and pundit Andrew Keen exposes the grave consequences of today’s......一起来看看《The Cult of the Amateur》这本书的介绍吧!

码农工具