掌恒小例子

最新推荐文章于 2023-05-05 00:27:42 发布
最新推荐文章于 2023-05-05 00:27:42 发布
阅读量292 收藏
点赞数
分类专栏： CSS 文章标签： css 布局 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Vivian_shuang/article/details/51848119
版权

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>D掌恒作品列表</title>

<link rel="stylesheet" href="css/reset.css">

<style type="text/css">

body{

height: 9999px;


}

a{

text-decoration: none;

}

.nav{

background-color: black;

height: 65px;

overflow: hidden;

position: fixed;

width: 100%;

opacity: 0.5;

}

.nc_img{

float: left;

}

.nc_as{

float: right;

margin-top: 20px;

}

.nav_content{

overflow: hidden;

margin: 0 auto;

width: 980px;

margin-top: 10px;

}

.nav_1{

position: fixed;

width: 100%;

}

.nc_as a{

color: white;

text-decoration: none;

margin-right: 10px;

border-right: 1px solid white;

padding-right: 10px;

}

.nc_as a:hover{

color: #00C3EC;

}

#about{

border: none;

}

.banner{

background-image: url(img/bg.jpg);

height: 580px;

background-repeat: no-repeat;

background-size: 100% 100%;

/* 最小宽度 */

min-width: 980px; 

}

.b_content{

text-align: center;

overflow: hidden;

}

.b_content h1{

font-size: 28px;

color: white;

margin-top: 133px;

}

.b_span{

margin-top: 20px;

}

.b_span span{

color: white;

border: 1px solid white;

padding: 5px;

margin: 20px;

}

.b_content p {

margin-top: 20px;

color: white;

}

.content{

text-align: center;

width: 100%;

min-width: 980px;

}

.c_1{

display: inline-block;

width: 100px;

height: 100px;

border: 1px solid #ccc;

margin: 20px 20px;

font-size: 15px;

-webkit-transition: 1s;

-o-transition: 1s;

transition: 1s;

}

.c_1 p{

margin: 40px auto;


}

.c_1:hover{

background-color: #00A6DC;

color: white;

}

.wrap1{

width: 1200px;

height: 500px;

background-color: white;

margin: 50px auto;

overflow: hidden;


}

.artical{

width: 228px;

height: 154px;

border: 2px solid gray;

float:left;

padding: 2px;

position: relative;

margin-left: 10px;

margin-top: 10px;

}

.div1{

width: 232px;

height: 158px;

background-color: #29A2DE;

/*float: left;*/

position: absolute;

top:0;

left:0;


text-align: center;

line-height: 158px;

font-size: 20px;

color: white;


opacity: 0;

-webkit-transition: 0.2s;

-o-transition: 0.2s;

transition: 0.2s;

}

.artical:hover .div1{

opacity: 1;

}


</style>

</head>

<body>

<div class="wrap">

<div class="head">

<div class="nav"></div>

<div class="nav_1">

<div class="nav_content">

<div class="nc_img">

<img src="img/logo.png" alt="">

</div>

<div class="nc_as">

<a href="#">Home</a>

<a href="#">Abilities</a>

<a href="#">Portfios</a>

<a id="about" href="#">About</a>

</div>

</div>

</div>

<div class="banner">

<div class="b_content">

<h1>广州掌恒---专注于数字化营销领域</h1>

<div class="b_span">

<span>互联营销、研发、运营</span><span>网易、联想联合创始人</span>

</div>

<p>电商、IM通讯、QQ营销、移动OA办公</p>

<p>服务于地产、餐饮、广告、教育培训、医疗、服装等多个行业</p>

</div>

</div>

</div>

</div>

<div class="content">

<a href="#">

<div class="c_1">

<p>平台</p>

</div>

</a>

<a href="#">

<div class="c_1">

<p>新媒体</p>

</div>

</a>

<a href="#">

<div class="c_1">

<p>设计</p>

</div>

</a>

<a href="#">

<div class="c_1">

<p>APP</p>

</div>

</a>

</div>

<div class="wrap1">

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x1.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x2.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x3.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x4.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x5.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x6.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x7.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x8.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x9.png" alt="">

</a>

<a href="#" class="artical">

<div class="div1">

<p>慕思寝居家居网站</p>

</div>

<img src="img/x10.png" alt="">

</a>

</div>

</body>

</html>




Vivian_shuang
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
PHP的小例子
12-09
PHP的小例子
小程序“成语猜题”部分答案，总共28667题
py编程|爱分享
01-15 5万+
哀哀父母 可哀呀可哀，我的父母啊！原指古时在暴政下人民终年在外服劳役，对父母病痛、老死不能照料而悲哀。 哀哀欲绝 绝：断气，死。形容极其悲痛。 哀兵必胜 原意是力量相当的两军对阵，悲愤的一方获得胜利。后指受欺侮而奋起抵抗的军队，必定能取胜。 哀而不伤 哀：悲哀；伤：伤害。忧愁而不悲伤。比喻做事没有过头也无不及。 哀感天地 形容极其哀痛，使天地都为之感动。 哀感顽艳 原意是指内容凄切，文辞华丽，使愚笨和聪慧的人同样受感动。后多用来指艳情的小说、戏曲、电影
MySQL系列教程（五）
lifetragedy的专栏
10-25 7643
MyCATMyCat是基于阿里开源的Cobar产品而研发，Cobar的稳定性、可靠性、优秀的架构和性能以及众多成熟的使用案例使得MYCAT一开始就拥有一个很好的起点，站在巨人的肩膀上，我们能看到更远。业界优秀的开源项目和创新思路被广泛融入到MYCAT的基因中，使得MYCAT在很多方面都领先于目前其他一些同类的开源项目，甚至超越某些商业产品。
一个在线五笔的例子的代码，很不错，转载过来共享
热门推荐
沉　麟　的专栏
08-03 7万+
在线五笔输入 脚本说明:把如下代码加入区域中TD { FONT-SIZE: 9pt}A:link { COLOR: #000080; TEXT-DECORATION: none}A:visited { COLOR: #808080; TEXT-DECORATION: none}A:hover { COLOR: #f0000
Python进阶篇
05-05 1325
大家好，我是易安！今天我们继续Python的学习，内容稍微有些多，不过我会尽可能举一些例子让你理解。 对象比较与拷贝 在前面的学习中，我们其实已经接触到了很多 Python对象比较和复制的例子，比如下面这个，判断a和b是否相等的if语句： if a == b:    ... 再比如第二个例子，这里l2就是l1的拷贝。 l1 = [1, 2, 3]l2 = list(l1) 但你可
c 语言 内部函数与外部函数,C语言-内部函数与外部函数.doc
weixin_39944146的博客
05-22 90
C语言-内部函数与外部函数吩算彭毙摊鬼笺选瓦瑞疡呐缴识曹研酥腹怕语透逆谓撮渴聋脐壤本精俄漏煎电米履详醋捐丧减掩敷挣煮阜祖锁锨溃睹喉爪冯耍缀示瞎嘴允戏馅径俊窗嚣节愈娶涩睡给峪凄灼助凝棍妻凌瞬诵攻枝溜甥戈诬彬淌抒班革谅军葵企料裸损中汞淆湾岗鱼铡袋盯蝗荣颂锣览焦犊夫炉买佣炽佃赤罢翁妓篮鼓嘘态乔窥琳魔批木掸锦馒块绅企斟憎嫂洁惰舍急家尔邦闸剂绽泽厉洛研般哨了瑞得垒腔瑞柔焰狰乐缀匪悍祸秧囤釉闹斧淫占诬赫缄元迁...
激发无限潜能
王世凡的技术博客
10-18 8986
  　　　　　　　　　　　　　　　　　　目录 　　　　　　　　　　　　　　　　　　第一章 国王的权杖 　　　　　　　　　　　　　　　　　　第二章 差异造成的差别 　　　　　　　　　　　　　　　　　　第三章 心境的力量 　　　　　　　　　　　　　　　　　　第四章 卓越的诞生：信念 　　　　　　　　　　　　　　　　　　第五章 成功的七个谎言 　　　　　　　　　　　　　　　　　　第六章 善用你的心灵：...
信息抽取实战：命名实体识别NER【ALBERT+Bi-LSTM模型 vs. ALBERT+Bi-LSTM+CRF模型】（附代码）
南有芙蕖
07-18 1万+
实战：命名实体识别NER 目录实战：命名实体识别NER一、命名实体识别（NER）二、BERT的应用NLP基本任务查找相似词语提取文本中的实体问答中的实体对齐三、ALBERTALBERT 的三大改造ALBERT 效果如何总结四、ALBERT+Bi-LSTM模型五、ALBERT+Bi-LSTM+CRF模型思考 一、命名实体识别（NER）   本项目将会简单介绍自然语言处理（NLP）中的命名实体识别（NER）。   命名实体识别（Named Entity Recognition，简称NER）是信息抽取、问答系统、
这一次，为广州扛旗举鼎的为什么是融创文旅城？
yidiancaijing的博客
06-18 427
时代前沿，粤港澳大湾区是当之无愧的中国“C位”，四十年风雨磨洗，如今的粤港澳大湾区被视为是新时代推动形成我国全面开放新格局的新举措，国家重点建设对象。 那么问题来了，粤港澳大湾区名城如珍珠般集萃，香港、澳门、广州、深圳……随便拿出一个城市，都是享誉世界的知名城市，它们各擅胜场、各有千秋，香港要成为更具竞争力的国际大都会，澳门要建设世界旅游休闲中心，深圳要成为具有世界影响力的创新创意之都，而广...
仿写版《陈情表》
pstlz2008的专栏
09-07 5422
恋爱版陈情表 我因瘦弱，夙遭欺凌。幼小心灵，深受伤害。行年四岁，无一朋友。邻女如花悯我寂寞，热情相待。如花四岁容颜似苞，九岁似花，温婉大方，亭亭玉立。而我既无玩具，终鲜零食；捕获芳心，还靠蜜语。二人在外看草长莺飞，柳绿花红；在内看舒克贝塔，多啦A梦。笑语欢声，形影不离。若遇如花偶感风寒，常在床蓐；我久立与其家门外，未曾废离。 上学时期，关系愈好。前小学有人疑我变态，后初中有人告我早恋。
unity小地图例子
04-08
unity小地图例子
ibatis小例子Demo
07-01
ibatis小例子Demo,对于初学者是个很好的例子。
python 100个小例子
08-04
Python 大数据 爬虫 小例子
okhttp请求 干货小例子
05-24
okhttp请求 干货小例子
盒子嵌套
Vivian_shuang的博客
07-06 3052
DOCTYPE html> html lang="en"> head> meta charset="UTF-8"> title>Documenttitle> style> #box1{ width: 50px; height:50px; background:#7FFF59; display: inline-block; border:5px solid #FFFD
映纷视觉小例子
Vivian_shuang的博客
07-06 2538
DOCTYPE html> html lang="en"> head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> link rel="stylesheet"
冰艺小例子3
Vivian_shuang的博客
07-07 941
DOCTYPE html> html> head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> title>title> link rel="stylesheet"
弹性布局小例子
Vivian_shuang的博客
07-06 751
DOCTYPE html> html> head> meta charset="UTF-8"> title>title> style> *{ margin: 0; padding: 0; } html,body,.wrap{ height: 100%; } .wrap{ width: 100%; height: 100%; display:-webki
ribbon wpf 小例子
最新发布
09-29
Ribbon（功能区）是WPF（Windows Presentation Foundation）中的一种用户界面控件，它提供了类似于Microsoft Office中Ribbon界面的功能。下面是一个简单的Ribbon WPF小例子： 首先，我们需要在WPF应用程序的XAML文件中引入Ribbon控件的命名空间： ``` xmlns:r="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon" ``` 然后，在定义界面的主窗口中添加一个Ribbon控件： ``` <r:Ribbon> <!-- 在这里添加Ribbon的各个组件：选项卡、组、按钮等 --> </r:Ribbon> ``` 接下来，我们可以在Ribbon控件中添加选项卡和组来组织界面上的按钮和其他控件。例如： ``` <r:RibbonTab Header="主页"> <r:RibbonGroup Header="常用操作"> <r:Button Command="{x:Static local:MainWindow.MyCommand}" Content="保存" /> <!-- 在这里可以添加更多的按钮和其他控件 --> </r:RibbonGroup> </r:RibbonTab> ``` 这个例子中，我们创建了一个名为"主页"的选项卡，该选项卡下面有一个名为"常用操作"的组。在这个组中，我们添加了一个按钮，其命令绑定到MainWindow类中定义的MyCommand命令。 在应用程序的代码中，我们需要定义MyCommand命令，并在命令的执行函数中添加相应的逻辑。例如： ``` public partial class MainWindow : Window { public static ICommand MyCommand { get; } = new RelayCommand(ExecuteMyCommand); private static void ExecuteMyCommand(object parameter) { // 执行保存操作的逻辑 } } ``` 在这个例子中，我们使用了RelayCommand类来创建一个命令对象，并通过静态属性MyCommand在XAML中绑定。当按钮被点击时，命令的执行函数ExecuteMyCommand将被调用，我们可以在此函数中添加我们需要执行的保存操作的逻辑。 以上就是一个简单的Ribbon WPF小例子，其中我们展示了如何添加Ribbon控件、设置各个组件的属性以及命令的使用。通过这个例子，我们可以初步了解如何使用Ribbon控件来构建具有Microsoft Office风格的界面。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值