HTML学习笔记——标准网页设计+使用CSS、Javascript

一.标准网页设计 1.标准网页概述: 标准网页设计要遵循,内容与表现相分离. 内容 + 表现 = 页面 --- 即 :XHTML + CSS = PAGE 内容与变现相分离,也就是内容使用HTML.XHTML,而怎么对内容排版.显示使用CSS. 2.标准网页设计的优点: (1)代码更少,更容易维护. (2)页面下载更快,宽带要求更低,硬盘容量要求更少. (3)排版更加方便. (4)可以提高易用性和可扩展性(可以适应很多其它的设备:搜索蜘蛛/屏幕阅读器/打印机/手持设备/移动设备等). (…

ASP.NET MVC 学习笔记-7.自定义配置信息 ASP.NET MVC 学习笔记-6.异步控制器 ASP.NET MVC 学习笔记-5.Controller与View的数据传递 ASP.NET MVC 学习笔记-4.ASP.NET MVC中Ajax的应用 ASP.NET MVC 学习笔记-3.面向对象设计原则

ASP.NET MVC 学习笔记-7.自定义配置信息 ASP.NET程序中的web.config文件中,在appSettings这个配置节中能够保存一些配置,比如, 1 <appSettings> 2 <add key="LogInfoProvider" value="Cookie" />//登录信息保存方式 3 </appSettings> 但是这些配置都是单个字符串信息,在某些情况下,无法做到灵活配置. 针对这种情况,使用…

thinkphp学习笔记5—模块化设计

原文:thinkphp学习笔记5-模块化设计 1.模块结构完整的ThinkPHP用用围绕模块/控制器/操作设计,并支持多个入口文件盒多级控制.ThinkPHP默认PATHINFO模式,如下: http://serverName/index.php(或者其他应用入口文件)/模块/控制器/操作/[参数名/参数值...] 应用:由同一个入口文件访问的项目称为一个应用,在完整版的代码中就是Application 模块:一个应用下面可以包含多个模块,每个模块对应独立的目录,在完整版的代码中有Admin,…

网页设计（CSS&JS）

实验一简单静态网页设计一. 实验目的: 复习使用记事本编辑网页的方法. 熟悉不同表单控件类型的应用. 练习使用记事本在网页中添加表单与表单元素. 二. 实验内容: 根据提供的素材设计在线调查问卷. 三. 实验要求: 熟练掌握使用记事本进行简单网页编辑的方法. 能够区分不同表单元素的应用场景. 掌握表单与表单元素的元素名和属性对. 四. 实验学时:4学时五. 实验步骤: 实验准备: 1.在硬盘上为本实验建立文件夹(以下称为“实验文件夹”). 2.根据提供的素材设计在线调查问卷…

学习笔记第五章使用CSS美化网页文本

第五章使用CSS美化网页文本学习重点定义字体类型.大小.颜色等字体样式: 设计文本样式,如对齐.行高.间距等: 能够灵活设计美观.实用的网页正文版式. 5.1 字体样式 5.1.1 定义字体类型 CSS使用font-family来定义字体类型,用法如下: font-family:name /*name表示字体名称,可以指定多种字体*/ /*不懂,多种字体怎么应用?*/ font-family:ncursive | fantasy…

学习笔记第七章使用CSS美化超链接

第7章使用CSS美化超链接学习重点认识超链接熟悉伪类定义超链接样式能够灵活设计符合页面风格的链接样式 7.1 定义超链接在HTML5中建立超链接需要两个要素:设置为超链接的网页元素和超链接指向的目标地址. 7.1.1 URL格式 URL(Uniform Resource Locator,统一资源定位器)用语指定网上资源的位置和方式.通常由三部分组成: 协议(或服务方式). 存有该资源的主机IP地址(有时也包括端口号). 主机资源的具体地址,如目录和文件名等. 示例:protoc…

学习笔记第六章使用CSS美化图片

第六章使用CSS美化图片 6.1 在网页中插入图片 GIF图像跨平台能力,无兼容性问题: 具有减少颜色显示数目而极度压缩文件的能力,不会降低图像的品质(无损压缩): 支持背景透明功能,便于图像融合到其它背景色中: 可以储存多张,实现动态显示. JPEG图像有损压缩,部分细节会被忽略: 跨平台,与GIF格式相同: 支持1670万种颜色,很好地再现摄影图像: 不支持背景透明和交错显示功能. PNG图像具有GIF和JPEG的双重优点.新的无损压缩文件格式,支持1670万种颜色,支持索引度.…

web前端学习（三）css学习笔记部分（5）-- CSS动画--页面特效、HTML与CSS3简单页面效果实例

CSS动画--页面特效部分内容目前仅仅观看了解内容,记录简单笔记,之后工作了进行内容的补充 7. CSS动画--页面特效 7.1 2D.3D转换 7.1.1 通过CSS3转换,我们能够对元素进行移动.缩放.转动.拉长或拉伸转换是使元素改变形状.尺寸和位置的一种效果可以使用2D.3D来转换元素 7.1.2 2D转换方法 translate() rotate() scale() skew() matrix() 7.1.3 3D转换方法: rotateX() rotateY() 7.2 …

HTML5学习笔记（七）：CSS盒子模型

在CSS中,盒子模型有W3C标准盒子模型和IE盒子模型两种,这里所谈的是基于W3C标准的盒子模型. 所有HTML元素都可以看作盒子,即所有HTML标签都支持盒子模型的属性,在CSS中,"box model"这一术语是用来设计和布局时使用.CSS盒模型本质上是一个盒子,封装周围的HTML元素,它包括:边距,边框,填充,和实际内容. Margin(外边距) - 清除边框外的区域,外边距是透明的. Border(边框) - 围绕在内边距和内容外的边框. Padding(内边距) - 清除内容…

HTML学习笔记（三）样式CSS

1.样式外部样式表(通过css文件定义样式,整体样式) 当样式需要被应用到很多页面的时候,使用外部样式表,在 head 部分<link>. <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> 内部样式表(单个文件的样式) 当单个文件需要特别样式时,就可以使用内部样式表.你可以在 head 部分通过 &l…

web前端学习（三）css学习笔记部分（3）-- css常用操作

5. CSS常用操作 5.1 对齐使用margin属性进行水平对齐 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ width:300px; height:100px; margin:0px auto; background-colo…

web前端学习（三）css学习笔记部分（1）-- css入门基础知识+基本样式

1.介绍及语法 1.1CSS概述: CSS指层叠样式表 CSS样式表极大地提高了工作效率如果值大于一个单词,需要加上引号(意思是值只有一个的时候可以不加引号) 1.2CSS高级语法 1.选择器分组 h1,h2,h3,h4,h5,h6{color:red;} 2.继承(需要子元素没有属于他自己的CSS样式) body{ color:green; } 2.派生选择器 2.1派生选择器: 通过依据元素在其位置的上下文关系来定义样式 css.html <!DOCTYPE html> <html…

大前端学习笔记整理【一】CSS盒模型与基于盒模型的6种元素居中方案

概览 CSS盒模型,规定了元素框来处理元素的内容.内边距.边框和外边距的方式元素部分是指内容部分,也是最实际的内容,包围内容的称之为内边距,内边距外围是边框,边框外围就是外边距:且外边距是透明的,所以并不会阻挡其后的元素 * { margin: 0; padding: 0; } 这是在CSS中最常见的初始化CSS的代码,用于覆盖浏览器的默认样式浏览器兼容性大多数浏览器都会按照上面的图示来呈现内容.然而 IE 5 和 6 的呈现却是不正确的.根据 W3C 的规范,元素内容占据的空间是由 w…

C#学习笔记8：HTML和CSS基础学习笔记

5.字体标签:<font size="7" color=…

学习笔记（一） HTML+CSS基础课程

这个周把慕课网的<HTML+CSS基础课程>课程学完,内容都是非常非常基础的,不过还是学到了几个小知识点,记下来先. <a>超链接发送邮件直接上把他的图片给挪过来了,我就不打字了. 例:<a href="mailto:yy@imooc.com?subject=主题名称&body=邮件内容">对此影评有何感想,发送邮件给我</a> CSS选择器权值标签的权值为1, 类选择符的权值为10, ID选择符的权值最高为100 例: p{…

网页设计——7.css的入门

css的介绍 div+css的设计: 什么是div? 理解示意图: 实例操作: 这里就要用到div+css的布局操作先写一个html文件,见下图: <html><head><meta charset="utf-8"><title>css的演示</title><link href="案例八.css" type="text/css"…

关于网页设计的css+html相对定位和决定定位的理解

css中有很多定位,其中最重要的是相对定位和绝对定位: 定位很重要,不搞好,网页就会很乱,显示的完全不是自己想要的效果,自己必须掌握: 首先说一个重要的结论:绝对定位,是不占位置的,总是相对离自己最近的一个相对定位的元素,进行相对定位,所以一个元素准备使用绝对定位,首先第一步就必须检查他最近的父级元素是否是相对定位,如果没有设置需要设置,不然这个绝对定位元素会去找自己元素的上上级元素(相对定位的元素),来进行定位. 所有这里给出几个结论: 相对定位和绝对定位都是相对元素(自己或者别的)元素进行…

完整的Django入门指南学习笔记7 网页自动翻译

转自[https://simpleisbetterthancomplex.com/series/2017/10/16/a-complete-beginners-guide-to-django-part-7.html] Django的初学者指南 - 第7部分 2017年10月16日 23分钟阅读评论 37388 意见第7部分,共7部分苹果电脑视窗 Linux的 7/7系列介绍欢迎来到我们教程系列的最后一部分!在本教程中,我们将把Django应用程序部署到生产服务器.我们还将为我们的…

1. svg学习笔记-在网页中使用svg

在网页中使用svg有以下三种方式 1. svg归根结底来说是一种图像格式,虽然有别于jpeg,gif,png等位图图像格式,所以在网页中能嵌入图像的地方都可以嵌入svg,例如将svg文件设置为<img>元素的src属性,或者是给任意的元素设置背景图像,或者是设置为CSS3的属性border-image.但是这种方式的缺点也很明显,就是浏览器在渲染svg图像的时候,会将svg描述的矢量图像转换成栅格图像用于显示,这就失去了svg的一部分功能,svg是文本描述的图像格式,可能会有一些引用文件,比如…

HTML5学习笔记（六）：CSS基本样式

背景需要注意:背景的所有属性都不会向下进行继承. 背景色我们可以设定一个纯色为背景色. p {background-color: red;} a {background-color: #ff0000;} 背景色有特点如下: 可以为所有元素设置背景色,这包括 body 一直到 em 和 a 等行内元素. background-color 不能继承,其默认值是 transparent.transparent 有“透明”之意.也就是说,如果一个元素没有指定背景色,那么背景就是透明的,这样其祖先元素…

HTML5学习笔记（五）：CSS基础

CSS 指层叠样式表 (Cascading Style Sheets),在网页中用来定义网页的元素如何进行显示. CSS 对大小写不敏感.不过存在一个例外:如果涉及到与 HTML 文档一起工作的话,class 和 id 名称对大小写是敏感的. 书写格式 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明: selector {declaration1; declaration2; ... declarationN } 声明的写法按照冒号分隔属性名及属性值: selector {prop…

Python Web学习笔记之为什么设计GIL

GIL(global interpreter lock),全局解释器锁,是很多编程语言实现中都具有的特性,由于它的存在,解释器无法实现真正的并发.它也是 Python 中经常讨论的话题之一. Python 作为编程语言存在多个具体实现,包括最常用的 CPython.超集 Cython..NET 平台的 IronPython.JVM 上的 Jython,R 语言实现的 RPython.JIT 版本的 PyPy 等等.这里我们只讨论最常用的.官方的 CPython 实现. GIL 有什么好处? 简单…

CSS学习笔记（8）--纯CSS绘制三角形（各种角度）

纯CSS绘制三角形(各种角度) CSS三角形绘制方法,学会了这个,其它的也就简单. 我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果.特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来. 今天给大家带来 CSS 三角形绘制方法复制代码代码如下: #triangle-up { width: 0; height: 0; border-left: 50px solid transp…

Adaptive AUTOSAR 学习笔记 7 - 应用设计和 Manifest

本系列学习笔记基于 AUTOSAR Adaptive Platform 官方文档 R20-11 版本 AUTOSAR_EXP_PlatformDesign.pdf 缩写 AP:AUTOSAR Adaptive Platform 3.5 Application Design Application Design 描述所有设计相关的建模,侧重以下方面: 数据类型:用于软件设计.实现过程中分类信息服务接口:面向服务通信的核心定义应用如何访问面向服务的通信 Persistency 接口:访问持久性数…

大前端学习笔记整理【二】CSS视觉格式化模型

1. 概念在视觉格式化模型中,文档树中的每个元素都将会根据盒模型产生零到多个盒子.这些盒子的布局由如下因素决定: 盒子的尺寸和类型定位策略(正常文档流,浮动或者绝对定位) 和文档树中其他元素的关系额外的信息(比如视口的大小,图片的原始尺寸等) 1.1 视口(viewport) 连续媒体(continuous media)的UA(user agent/用户代理)通常会给用户提供一个视口,一般为一个窗口或者屏幕上的一片可视区域.用户通过这个视口查看文档(document).当视口的大小改变时,…

Axure学习笔记1-－原型设计概述

Axure原型 1.原型的出现 -软件功能复杂,用户需求多 -挖掘用户的实际需求 -项目组之间降低沟通成本 2.类型: ［草图原型］描述产品大概需求,记录瞬间灵感［低保真原型］展示系统的大致结构和基本交互效果:可用于给项目组同事进行交流［高保真原型］视觉和体验上几乎接近真实产品:最多用于给用户进行演示 3.原型设计方式不是单一的,可以用草图.文字等等,Axure是一个快速的原型设计工具,方便用于与用户和项目组同时交流 4.axure RP(rapid prototyping)可以让设计师们利…

Python Web学习笔记之多道程序设计技术和操作系统的特性

采用了多道程序设计技术的操作系统具有如下特性 : ① 并发性.它是指两个或两个以上的事件或活动在同一时间间隔内发生.操作系统是一个并发系统,并发性是它的重要特征,操作系统的并发性指计算机系统中同时存在若干个运行着的程序,因此,它应该具有处理和调度多个程序同时执行的能力. ②共享性. 共享指计算机系统中的资源可被多个并发执行的用户程序和系统程序共同使用,而不是被其中某一个程序所独占. 共享有两种形式:其一是顺序共享.其二是并发共享. ③ 不确定性. 不确定性也称异步性. 在多道程序并发执行的环…

大前端学习笔记【七】关于CSS再次整理

如果你在日常工作中使用 CSS,你的主要目标可能会重点围绕着使事情“看起来正确”.如何实现这一点经常是远不如最终结果那么重要.这意味着比起正确的语法和视觉结果来说,我们更少关心 CSS 的工作原理. CSS 的视觉结果通常是操作隐藏属性的间接后果,你可能还没有意识到这一点.某些 CSS 属性(比如 background-color)与你看到的内容有直接而明显的关系.同时,其它像 display 这样的属性对于我们很多人来说仍然是模棱两可的,因为结果似乎与上下文环境有很大关系.所以...我们需要对…

HTML5学习笔记（十）：CSS常用操作

对齐在 CSS 中,可以使用多种属性来水平对齐元素. 水平对齐使用 margin 属性来水平对齐,可通过将左和右外边距设置为 "auto",来对齐块元素. 把左和右外边距设置为 auto,规定的是均等地分配可用的外边距.结果就是居中的元素: .center { margin-left:auto; margin-right:auto; width:70%; background-color:#b0e0e6; } 也可以简写为,这里把上下的外边距设定为0: .center { marg…

HTML5学习笔记（八）：CSS定位

CSS 定位 (Positioning) 属性允许你对元素进行定位. 定位和浮动 CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠.定位的基本思想很简单,它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素.另一个元素甚至浏览器窗口本身的位置. 一切皆为框 div.h1 或 p 元素常常被称为块级元素.这意味着这些元素显示为一块内容,即“块框”.与之相反,span 和 strong 等元素称为“行内元素”,这是因为它们的内容显示在行中…

【HTML学习笔记——标准网页设计+使用CSS、Javascript】的更多相关文章