学制作网页的一些笔记

三种语言:

1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。

 

2. CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

 

3. JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。

 

标签:

html中的标签一般都是成对出现的,分开始标签和结束标签。结束标签比开始标签多了一个“/”。

 

 <span>标签是没有语义的,它的作用就是为了设置单独的样式用的。

 

如果现在我们想把上一小节的第一段话“美国梦”三个字设置成blue(蓝色),但注意不是为了强调“美国梦”,而只是想为它设置和其它文字不同的样式(并不想让屏幕阅读器对“美国梦”这三个字加重音读出),所以这样情况下就可以用到<span>标签了。

 

在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行,就必须输入<br/>。

 

<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。

 

<img src="图片地址" alt="下载失败时的替换文本"title = "提示文本">

 

1.<form> :<form>标签是成对出现的,以<form>开始,以</form>结束。

 

2.action :浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。

 

3.method : 数据传送的方式(get/post)。

 

<form   method="post"  action="save.php">

       <label for="username">用户名:</label>

       <input type="text" name="username" />

       <label for="pass">密码:</label>

       <input type="password" name="pass" />

</form>

 

语法:

 

<form>

  <input type="text/password" name="名称" value="文本" />

</form>

1、type:

 

   当type="text"时,输入框为文本输入框;

 

   当type="password"时, 输入框为密码输入框。

 

2、name:为文本框命名,以备后台程序ASP 、PHP使用。

 

3、value:为文本输入框设置默认值。(一般起到提示作用)

 

<input  type="radio/checkbox"  value="值"    name="名称"   checked="checked"/>

1、type:

 

   当 type="radio" 时,控件为单选框

 

   当 type="checkbox" 时,控件为复选框

 

2、value:提交数据到服务器的值(后台程序PHP使用)

 

3、name:为控件命名,以备后台程序 ASP、PHP 使用

 

4、checked:当设置checked="checked" 时,该选项被默认选中

 

CSS样式:

p{

  font-size:20px;/*设置文字字号*/

  color:red;/*设置文字颜色*/

  font-weight:bold;/*设置字体加粗*/

}

单独设置字体颜色:

span{

  color:blue;

}

</style>

</head>

<body>

   <p>慕课网,<span>超酷的互联网</span>、IT技术免费学习平台,创新的网络一站式学习、实践体验;<span>服务及时贴心</span>,内容专业、<span>有趣易学</span>。专注服务互联网工程师快速成为技术高手!</p>

</body>

</html>

CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式、嵌入式和外部式三种。

优先级:内联式 > 嵌入式 > 外部式

 

更有趣的是伪类选择符,为什么叫做伪类选择符,它允许给html不存在的标签(标签的某种状态)设置样式,比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色:

 

a:hover{color:red;}

上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜色变红。这样就会使第一段文字内容中的“胆小如鼠”文字加入鼠标滑过字体颜色变为红色特效。

 

div{

  padding-top:20px;

  padding-right:10px;

  padding-bottom:15px;

  padding-left:30px;

}

 

CSS包含3种基本的布局模型,用英文概括为:Flow、Layer 和 Float。

在网页中,元素有三种布局模型:

1、流动模型(Flow)

2、浮动模型 (Float)

3、层模型(Layer)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值