<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="border:1px solid grey; text-align:center;" ><img alt="" src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width=^f('Device_info').any('1') ? '200px' : '100%'^><br/><b>雀巢</b></div>
<div style="border:1px solid grey; text-align:center;width:^f('Device_info').any('1') ? '200px' : '100%'^ " ><img alt="" src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width=^f('Device_info').any('1') ? '200px' : '100%'^><br/><b>雀巢</b></div>
<b><u>加粗/下划线</u></b>
<b style="color: blue">加粗/蓝色</b>
<b></b>
<span style="padding: 0 12px"> 设置外边距 </span>
<span style="color: blue"> 【单选】 </span>
<p style="text-align:center; font-weight: bold;"> 居中+加粗 </p>
<!-- <center></center> -->
首行缩进 2个字符: <p style="text-indent:2em"> 段落 </p>
段落去内外边距: <p style=" margin:0; padding:0;"></p>
图片:<center><img src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="100" /><br/><center>ofo共享单车</center></center>
<div style="border:1px solid grey; " ><center><img alt="" src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="100"></center><br/><center><b>雀巢</b></center></div>
<div style="border:1px solid grey; width:150px;" ><center><img alt="" class="imgs" src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" style="width: 100px;"></center><center><b>抖音</b></center></div>
感觉最好的:<div style="text-align:center; " ><img src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" style="width: 100%; height: auto;"/><br/><div >野格</div></div>
内联框架 iframe
<iframe align='middle' frameborder='1' scrolling='yes' src='https://www.zhiding.cn/intel/article/^f('QDL0x2').value()^_1' width='100%' height='400px'>
</iframe>
Grid 的 gridlabel , 去除隐藏多余边框 <!-- 系统中可以设置 -->
<style>
.gridlabel {
border-color: transparent #95B7F3 transparent transparent;
}
</style>
手机端&&填空题
<style>
.numeric input[type=number],
.numericlist input[type=number] {
width: 40%;
}
</style>
<!-- 手机端分组不出示大类 单/多选题样式调整 -->
<style type="text/css">
/* 手机端样式调整 */
li.confirmit-group-heading {
display: none;
}
li.confirmit-not-within-group {
padding-left: 10px;
border-top-width: 0px !important;
}
</style>
<!--手机端分组不出示大类 grid 题型 -->
<style type="text/css">
/* 手机端样式调整 */
.confirmit-group-heading {
display: none;
}
/* 加粗 */
.grid-answer-label{
font-weight: bold;
}
</style>
<!-- 开放题open不能拖动文本框的代码 系统中可以设置 -->
<style>
textarea {
resize: none;
}
</style>
<!-- 去分组后不用组名的元素的空格 grid题型 系统中可以设置-->
<style>
.gridgroupheader{
padding: 0px;
}
</style>
<!-- grid手机端左边的加粗 PC端可以在系统中设置-->
<style>
.grid-answer-label{
font-weight: bold;
}
</style>
<!-- 3D-grid手机端上方的加粗 -- 有效了 !important
scale 的宽度
-->
<style>
h1.question-text{
font-weight: bold !important;
}
.scale{
width:90px;
}
</style>
<!-- multi grid 有效 -->
<style>
.question-content>h1.question-text{
font-weight: bold !important;
}
</style>
<!-- 多选项框和图片对齐 -->
<style>
.multi-answer label {
background-position: left;
}
</style>
<!-- 单选项框和图片对齐 -->
<style>
.single-answer label {
background-position: left;
}
</style>
f('Device_info').any('1') ? '(<center><img src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="600" /><br/></center>)' : '<center><img src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="100%" /><br/></center>'
<!-- 优化 -->
<center><img src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="^f('Device_info').any('1') ? '600px' : '100%'^" /><br/></center>
<style>
imgs:hover{
width: 600px;
}
</style>
<style>
.scale{
width: 100px;
}
</style>
<!-- 手机端 单/多选题 三列 -->
<style>
/* QEHV 是题号 */
#QEHV_inputs>.answerlist {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
#QEHV_inputs>.answerlist li {
/* 在此分为3列,每列占32% 的宽度 */
width: 32%;
}
</style>
<style>
#IMG1_1_inputs>.answerlist{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
#IMG1_1_inputs>.answerlist li {
/* 在此分为3列,每列占32% 的宽度 */
width: 32%;
}
</style>
<style>
img:hover {
width: 600px;
}
</style>
<style>
img {
cursor: pointer;
transition: all 0.6s;
/*放大动作在0.6s内完成*/
}
img:hover {
transform: scale(2);
/*放大倍数*/
}
</style>
<!-- 除了IE其它都是水平垂直居中 -->
<div id="S16img" style="border:1px solid grey; width: 200px; height: 200px;" ><center><img alt="" src="https://fanyi-cdn.cdn.bcebos.com/static/translation/img/header/logo_40c4f13.svg" width="100%"><br/>盖中盖a</center></div>
<style>
#S16img{
display: flex;
justify-content: center;
align-items: center;
}
</style>
</body>
</html>