H5/
- 1、value:
- 2、selected="selected":
- 设置selected="selected"属性,则该选项就被默认选中。
- 下拉列表也可以进行多选操作,在<select>标签中设置
multiple="multiple"属性,就可以实现多选功能,在 widows 操作系统下,进行多选时按下Ctrl键同时进行单击(在 Mac下使用Command +单击), 语法:
<input type="submit" value="提交">
type:只有当type值设置为submit时,按钮才有提交作用value:按钮上显示的文字语法:
<input type="reset" value="重置">type:只有当type值设置为reset时,按钮才有重置作用value:按钮上显示的文字语法:
<label for="控件id名称">
注意:标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。
- 外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“
.css”为扩展名,在<head>内(不是在<style>标签内)使用<link>标签将css样式文件链接到HTML文件内,如下面代码:<link href="base.css" rel="stylesheet" type="text/css" />注意:
1、css样式文件名称以有意义的英文字母命名,如 main.css。
2、rel="stylesheet" type="text/css" 是固定写法不可修改。
3、<link>标签位置一般写在<head>标签之内。 - <!DOCTYPE HTML>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>嵌入式css样式</title>
- <link href="style.css" rel="stylesheet" type="text/css" />
- </head>
- <body>
- <p>慕课网,<span>超酷的互联网</span>、IT技术免费学习平台,创新的网络一站式学习、实践体验;<span>服务及时贴心</span>,内容专业、<span>有趣易学</span>。专注服务互联网工程师快速成为技术高手!
- </p>
- </body>
- </html>
每一条css样式声明(定义)由两部分组成,形式如下:
选择器{
样式;
}在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。在很多方面,ID选择器都类似于类选择符,但也有一些重要的区别:
1、为标签设置id="ID名称",而不是class="类名称"。
2、ID选择符的前面是井号(#)号,而不是英文圆点(.)。
右侧代码编辑器中就是一个ID选择符的完整实例。
任务
我也来试试,为第二段文字中的“公开课”三个文字使用ID选择器的方式设置为绿色
1.在右边编辑器的第16行,输入:
<span id="setGreen">公开课</span>
2.在右边编辑器的第10-12行,输入:
#setGreen{
color:green;
}- # 是id .是class
还有一个比较有用的选择器子选择器,即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码:
.food>li{border:1px solid red;}这行代码会使class名为food下的子元素li(水果、蔬菜)加入红色实线边框。通用选择器
通用选择器是功能最强大的选择器,它使用一个(*)号指定,它的作用是匹配html中所有标签元素,如下使用下面代码使用html中任意标签元素字体颜色全部设置为红色:
* {color:red;}伪类选择符
更有趣的是伪类选择符,为什么叫做伪类选择符,它允许给html不存在的标签(标签的某种状态)设置样式,比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色:
a:hover{color:red;}上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜色变红。这样就会使第一段文字内容中的“胆小如鼠”文字加入鼠标滑过字体颜色变为红色特效。
关于伪选择符:
关于伪类选择符,到目前为止,可以兼容所有浏鉴器的“伪类选择符”就是 a 标签上使用 :hover 了(其实伪类选择符还有很多,尤其是 css3 中,但是因为不能兼容所有浏览器,本教程只是讲了这一种最常用的)。其实 :hover 可以放在任意的标签上,比如说 p:hover,但是它们的兼容性也是很不好的,所以现在比较常用的还是 a:hover 的组合。
分组选择符
当你想为html中多个标签元素设置同一个样式时,可以使用分组选择符(,),如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色:
h1,span{color:red;}它相当于下面两行代码:
h1{color:red;}
span{color:red;}
H5/的更多相关文章
- 【社交系统研发日记】如何在 Laravel 中 “规范” 的开发验证码发送功能
顺便发个小通知:7月15日ThinkSNS+开源版发布,同时非开源的APP也走出内测阶段,体验二维码也全面发布体验. 什么是ThinkSNS ? ThinkSNS(简称TS),一款全平台综合性社交系统 ...
- vue+node开发手机端h5页面开发遇到的坑
项目进行中...随时更新 这里记录了一些手机端调试的方式 一 css 1.文字超过span宽度显示...(单行文字) .topWrap .introduce span { padding: 0 17p ...
- H5学习
1.html{font-size:62.5%;}//不用font-size:10px的原因:(因为设了62.5%后就有1rem = 10px,便于用rem来指定元素的尺寸,这样响应式的时候可以直接改变 ...
- iOS原生App与H5页面交互笔记
文/MikeZhangpy(简书作者)原文链接:http://www.jianshu.com/p/4ed3e5ed99c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近在做一个项 ...
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- H5与客户端联调
进行H5移动端开发时,我们可以使用谷歌浏览器的设备工具栏进行,此方法实时方便快速,但这也是有限的,当我们需要在特定机型特定系统或者在webview中调试时,这种方法就显得很吃力了. 安卓: 一.与安卓 ...
- H5投放在朋友圈广告做压力测试
一.环境 MacOS Sierra 二.背景 朋友圈广告投放的H5需要做ab压测,这里不赘述. 具体官方文档如下:http://ad.weixin.qq.com/learn/n10 三.正文 (1)别 ...
- 社交系统/社群系统“ThinkSNS+”H5及PC端终于来了!一起来“找茬”
[什么是TS+?] ThinkSNS(简称TS),一款全平台综合性社交系统,为国内外大中小企业和创业者提供社会化软件研发及技术解决方案,目前最新版本为ThinkSNS+,简称TS+. 还记得2017年 ...
- H5、React Native、Native应用对比分析
每日更新关注:http://weibo.com/hanjunqiang 新浪微博!iOS开发者交流QQ群: 446310206 "存在即合理".凡是存在的,都是合乎规律的.任何新 ...
随机推荐
- 【转】Ubuntu中Vmware Tools的安装与卸载
原文网址:http://blog.csdn.net/huanghe423/article/details/7005611 Vmware Tools是VMware提供的一套非常人性化的程序,可以用来解决 ...
- 2019Falg
2019的Flag 2018 2018年对我来说是很重要的一年. 毕业--拿到硕士学位. 工作---成功转行进入互联网行业. 有了她. 上半年忙碌于毕业的各种事情,被毕业论文折磨的要疯,顺利走完所有流 ...
- Android Activity活动状态及生存周期
1.活动状态 每个活动在其生命周期中最多可能会有4中状态. (1)运行状态 当一个活动位于返回栈的栈顶时,此时活动就处于运行状态.系统不会回收处于运行状态的活动. (2)暂停状态 当一个活动不再处于栈 ...
- logcat调试系统
日志存放位置:/dev/log shell@xxx:/ $ ls /dev/log -l crw-rw-rw- root log , -- : events crw-rw-rw- root log , ...
- jeecg中ajax传值的前端js和后台代码
前端js: var b=1; $.ajax({ type : "POST", --Post请求方式 url : 'orderController.do?wuliao', --路径 ...
- Charles 协助解决 metaweblog 排序问题
Charles 是 http代理抓包工具,可有效用于手机客户端网络抓包,详见Charles安装说明.这里使用使用Charles的请求转发功能调试metaweblog的最近博文排序功能. 由于OpenL ...
- linux中日志文件查找,根据关键字,vi命令,awk和wc
参考: http://www.cnblogs.com/ggjucheng/archive/2013/01/13/2856896.html 当时需求:查看系统日志,统计系统的处理时间(从请求进去系统到系 ...
- C#操作PowerDesigner代码
首先,程序的界面如下:
- Redis: Redis支持五种数据类型
ylbtech-Redis: Redis支持五种数据类型 Redis支持五种数据类型:string(字符串) ,hash(哈希),list(列表),set(集合)及zset(sorted set:有序 ...
- 常见的sql server 链接问题------持续更新
问题1:超时时间已到.超时时间已到,但是尚未从池中获取连接.出现这种情况可能是因为所有池连接均在使用,并且达到了最大池大小 再查询窗口输入exec sp_who2进行查询链接消耗资源 可能出现的情况是 ...