- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时,我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
我在基于 W3 Schools' Bootstrap Company Theme 的网站上工作,我在 https://github.com/khpeek/peek-solutions 上分享过. (以前的版本在 www.peek.solutions 上在线)。这是到目前为止的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Theme Made By www.w3schools.com - No Copyright -->
<title>Peek Solutions</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="http://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
body {
font: 400 15px Lato, sans-serif;
line-height: 1.8;
/*color: #818181;*/
color: #181818;
}
h2 {
font-size: 24px;
text-transform: uppercase;
color: #303030;
font-weight: 600;
margin-bottom: 30px;
}
h4 {
font-size: 19px;
line-height: 1.375em;
color: #303030;
font-weight: 400;
margin-bottom: 30px;
}
.jumbotron {
background-image: url("img/Patagonia_Sirona_crop3.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
/*background-color: #050042;*/
color: #fff;
padding: 70px 25px;
font-family: Montserrat, sans-serif;
}
.container-fluid {
padding: 60px 50px;
}
.bg-grey {
background-color: #f6f6f6;
}
.logo-small {
color: #050042;
font-size: 50px;
}
.logo {
color: #050042;
font-size: 200px;
}
.thumbnail {
padding: 0 0 15px 0;
border: none;
border-radius: 0;
}
.thumbnail img {
width: 100%;
height: 100%;
margin-bottom: 10px;
}
.carousel-control.right, .carousel-control.left {
background-image: none;
color: #050042;
}
.carousel-indicators li {
border-color: #050042;
}
.carousel-indicators li.active {
background-color: #050042;
}
.item h4 {
font-size: 19px;
line-height: 1.375em;
font-weight: 400;
font-style: italic;
margin: 70px 0;
}
.item span {
font-style: normal;
}
.panel {
border: 1px solid #050042;
border-radius:0 !important;
transition: box-shadow 0.5s;
}
.panel:hover {
box-shadow: 5px 0px 40px rgba(0,0,0, .2);
}
.panel-footer .btn:hover {
border: 1px solid #050042;
background-color: #fff !important;
color: #050042;
}
.panel-heading {
color: #fff !important;
background-color: #050042 !important;
padding: 25px;
border-bottom: 1px solid transparent;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
.panel-footer {
background-color: white !important;
}
.panel-footer h3 {
font-size: 32px;
}
.panel-footer h4 {
color: #aaa;
font-size: 14px;
}
.panel-footer .btn {
margin: 15px 0;
background-color: #050042;
color: #fff;
}
.navbar {
margin-bottom: 0;
/*background-color: #818181;*/
z-index: 9999;
border: 0;
font-size: 12px !important;
line-height: 1.42857143 !important;
letter-spacing: 4px;
border-radius: 0;
font-family: Montserrat, sans-serif;
}
.navbar li a, .navbar .navbar-brand {
color: #fff !important;
}
.navbar-nav li a:hover, .navbar-nav li.active a {
color: #050042 !important;
background-color: #fff !important;
}
.navbar-default .navbar-toggle {
border-color: transparent;
color: #fff !important;
}
footer .glyphicon {
font-size: 20px;
margin-bottom: 20px;
color: #050042;
}
.slideanim {visibility:hidden;}
.slide {
animation-name: slide;
-webkit-animation-name: slide;
animation-duration: 1s;
-webkit-animation-duration: 1s;
visibility: visible;
}
@keyframes slide {
0% {
opacity: 0;
transform: translateY(70%);
}
100% {
opacity: 1;
transform: translateY(0%);
}
}
@-webkit-keyframes slide {
0% {
opacity: 0;
-webkit-transform: translateY(70%);
}
100% {
opacity: 1;
-webkit-transform: translateY(0%);
}
}
@media screen and (max-width: 768px) {
.col-sm-4 {
text-align: center;
margin: 25px 0;
}
.btn-lg {
width: 100%;
margin-bottom: 35px;
}
}
@media screen and (max-width: 480px) {
.logo {
font-size: 150px;
}
}
#accordion {text-align: left};
</style>
</head>
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60">
<!-- <nav class="navbar navbar-default navbar-fixed-top"> -->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#myPage">Peek Solutions</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="#about">About</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<div class="jumbotron text-center">
<h1>Welcome to Peek Solutions</h1>
<p>Pipeline integrity solutions for the energy industry.</p>
<!-- <form class="form-inline">
<input type="email" class="form-control" size="50" placeholder="Email Address" required>
<button type="button" class="btn btn-danger">Subscribe</button>
</form> -->
</div>
<!-- Container (About Section) -->
<div id="about" class="container-fluid">
<div class="row">
<div class="col-sm-8">
<h2>About us</h2><br>
<h4>Peek Solutions, an independent consulting company founded by Ralf Peek, provides pipeline integrity solutions and assurance support to the energy industry, including the application of structural reliability methods to assess and ensure integrity.</h4><br>
<!-- <p>Peek Consulting is a consulting company founded by Ralf Peek.</p> -->
<br>
<!-- <button class="btn btn-default btn-lg">Get in Touch</button> -->
<a href="#contact" class="btn btn-default btn-lg" role="button">Get in touch</a>
</div>
<div class="col-sm-4">
<p><center><strong>This website is currently under construction.</strong></center></p>
<!-- <span class="glyphicon glyphicon-signal logo"> This website is under construction</span> -->
<img src="img/under_construction.jpg"></img>
</div>
</div>
</div>
<!-- Container (Services Section) -->
<div id="services" class="container-fluid text-center bg-grey">
<h2>SERVICES</h2>
<h4>Our services include:</h4>
<br>
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse1">Pipeline Integrity Assessment and Design</a>
</h4>
</div>
<div id="collapse1" class="panel-collapse collapse in">
<div class="panel-body">Our services include the design and assessment of subea pipelines for lateral and/or upheaval buckling, arctic pipelines subject to ice gouging, stamukha loadings and/or thaw settlements, and pipelines crossing active faults, as well as more routine design/assessment.</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Structural Reliability Assessment (SRA)</a>
</h4>
</div>
<div id="collapse2" class="panel-collapse collapse">
<div class="panel-body">
<p>Ralf Peek has over 30 years of experience in the area of structural reliability assessment and the estimation and assessment of uncertainties affecting structural performance in order to ensure that safety margins are adequate to cover such uncertainties, including:
<ul>
<li>Reliability-based design of buried arctic subsea pipeline against loading by ice keels gouging the sea floor.</li>
<li>SRA for pipelines subject to lateral buckling under thermal expansion.</li>
<li>Operating pipelines subject to extreme conditions (for example, turbidity current loading).</li>
<li>Probabilistic response-based seismic loading assessment criteria.</li>
<li>Nuclear containment structure reliability assessment.</li>
<li>Peek Solutions can also coordinate and deliver Quantitative Risk Assessment (QRA), where necessary arranging for inputs on hydrocarbon release modeling from others. (QRA includes assessment of the consequences of failure as well as the probability of occurrence, and typically involves integration of muti-disciplinary inputs, as well as inputs based on local knowledge into a model.)</li>
</ul>
<p>Reasons to perform a Structural Reliability Analysis (SRA) or Quantitative Risk Asessment (QRA) could include:</p>
<ul>
<li>Extreme loadings are encountered such as ice, or geohazard loadings for which there are no established design methods and criteria.</li>
<li>Operating conditions (e.g. wet, sour service) can strongly affect the deformation capacity of the pipe.</li>
<li>Consequences of failure could be exceptionally severe.</li>
<li>New technology or a new concept is being used for which there is limited experience, and ingredient uncertainties affecting the performance are different from those for standard technology.</li>
<li>Where new, more reliable technology, inspection or assessment methods are used whereby uncertainties are reduced, and an adjustment in the required safety margins could be justified.</li>
<li>Value of information analysis under uncertainty in essence consists of performing SRA or QRA with and without the information so that the value of the information can be assessed. Such “information” might consist for instance of a (full scale) testing program, or other investigation to reduce uncertainties.</li>
<li>The loading for a pipeline is somewhere in between load- and displacement-controlled, so that existing criteria for either of these cases is not directly applicable, and a case-specific calibration of the required safety margins is needed.</li>
</ul>
<p>SRA and/or QRA ties together a number of aspects of design, specifications, fabrication and installation methods, monitoring, inspection and maintenance, and contingency response procedures, as all have a bearing on reliability. To include all these aspects properly typically requires a muti-disciplinary team, with expertise that typically cannot be found within a single company. Peek Solutions will assemble and engage such a team (e.g. by subcontracts), drawing from a network of specialists, as well as drawing from customer’s expertise, practices and procedures.</p>
<p>In SRA’s statistical data are used to quantify uncertainties. However in most cases there are important uncertainties for which statistical data are not available. Indeed these dominate more often than not. Ignoring such uncertainties, or making the SRA conditional upon certain assumptions about such uncertainties can be dangerous. Therefore Peek Solutions will assess all uncertainties, rather than only the ones for which statistical data are available, and quantify them by informed engineering judgment supported, engaging external experts as appropriate.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Pipeline Design or Operational Integrity Review, Assurance and/or Specification</a>
</h4>
</div>
<div id="collapse3" class="panel-collapse collapse">
<div class="panel-body">
<p>Despite the guidance available from design codes, the design process relies significantly on engineering judgment to define suitable analysis methods, and the associated assumptions, and approximations. Such judgments should be based on a knowledge of the conditions for which the safety margins in the design code have been calibrated, and how there may or may not differ from the conditions for the design under consideration. Safe and economical design requires not only state-of-the-art or beyond analysis methods, but also to understand differences between model and real behavior, their impact, and safety margins needed to cover the associated uncertainties. Peek Solutions can help to assure that such issues have been adequately addressed for pipeline designs where special challenges are involved.</p>
<p>Design reviews can sometimes raise issues at a time when this can have a deleterious effect on project schedules. A better alternative can be to develop a robust design approach from the onset. This can be done by engaging design review at the early stages, or even by developing a Design Specification prior to FEED (Front End Engineering Design) or detailed design.</p>
<p>The Design Specification includes design code interpretation (if applicable), analysis methods, and assumptions and approximations to be made, together with a pertinent example to illustrate these. Further it can include any testing programs, e.g. in the form of additional welding procedure qualification requirements to assure girth weld integrity understrain based design conditions, or special in-situ tests to reduce uncertainty associated with pipe-soil interaction. Where necessary the safety margins in the Design Specification are calibrated based on structural reliability assessment to ensure that a specified target reliability level is achieved.</p>
<p>In addition to design, Peek Solutions supports installation (where this can affect performance), and specification and interpretation of as-built and/or as-laid surveys.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse4">Concept Definition and Assessment</a>
</h4>
</div>
<div id="collapse4" class="panel-collapse collapse">
<div class="panel-body">
<p>In some cases it may be expedient to perform quick evaluations of a number of concepts in order to focus on the most promising ones, or check the feasibility of an innovative one which could deliver considerable life-cycle savings, but for which there is limited or no experience. Peek Solutions can help in this process to conceive, identify, and/or assess innovative concepts. For instance Ralf Peek invented an effective method to reliably trigger lateral buckles in order to safely accommodate thermal expansion called the “Zero-Radius-Bend (ZRB)” method. (See [ref] and/or search “ZRB pipeline” on the web for more information.) This method has been successfully adopted for a number of of high-temperature subsea pipelines for Sarawak Shell and others. According to a review of methods to trigger buckles for controlled thermal expansionby the Safebuck JIP [url], this ZRB is the only one with 100% success in triggering the buckles as intended.</p>
<p>To make innovation feasible, it needs to be assessed at an early stage. Peek Solutions can help by developing and assessing a feasibility-basis design at a level of detail that is sufficient to expose any devil that may be hiding in the details.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse5">Research and Development</a>
</h4>
</div>
<div id="collapse5" class="panel-collapse collapse">
<div class="panel-body">
<p>Peek Solutions’ ambition is to contribute to improved understanding and modeling for pipeline integrity assurance, not only by its own R&D efforts, but also by being at the interface between academic research and applications to the industry, in order to make better use of academic research, but also to influence academic research programs towards matters relevant to pipeline integrity.</p>
<p>Structural Reliability Assessment (SRA) provides an excellent framework to capture and quantify improved knowledge from R&D programs in terms of reduced uncertainty. The economic benefit this generates can then be assessed by a Value of Information Analysis (VIA). Conversely, SRA and VIA can also point to areas where R&D is most fruitful.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse6">Specialized Software Development</a>
</h4>
</div>
<div id="collapse6" class="panel-collapse collapse">
<div class="panel-body">
<p>Ralf Peek has experience with code development and application for Finite Element Analysis, having developed the NPEX code while at the University of Michigan. Using NPEX as a starting point, Peek Solutions can efficiently develop codes for specific applications, such as lateral buckling analysis, buried pipeline subject to ice loading or offset at a fault (with the soil modeled by springs), or calculation of pipe deformation capacity without local buckling.</p>
<p>Experience also includes the development of a material subroutine, VUMAT, for ABAQUS/Explicit to model undrained or drained saturated soil behavior during ice gouging over a buried pipeline.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Container (Contact Section) -->
<div id="contact" class="container-fluid">
<h2 class="text-center">CONTACT</h2>
<div class="row">
<div class="col-sm-5">
<p>Contact us and we'll get back to you within 24 hours.</p>
<p><span class="glyphicon glyphicon-map-marker"></span> Leersum, The Netherlands</p>
<p><span class="glyphicon glyphicon-phone"></span> +31 624272619</p>
<p><span class="glyphicon glyphicon-envelope"></span> <a href=mailto:ralf@peek.solutions>ralf@peek.solutions</a></p>
</div>
<div class="col-sm-7 slideanim">
<div class="row">
<div class="col-sm-6 form-group">
<input class="form-control" id="name" name="name" placeholder="Name" type="text" required>
</div>
<div class="col-sm-6 form-group">
<input class="form-control" id="email" name="email" placeholder="Email" type="email" required>
</div>
</div>
<textarea class="form-control" id="comments" name="comments" placeholder="Comment" rows="5"></textarea><br>
<div class="row">
<div class="col-sm-12 form-group">
<button class="btn btn-default pull-right" type="submit">Send</button>
</div>
</div>
</div>
</div>
</div>
<div id="googleMap" style="height:400px;width:100%;"></div>
<!-- Add Google Maps -->
<!-- <script src="http://maps.googleapis.com/maps/api/js"></script> -->
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyBimnrhiugaGSNN8WnsjpzMNJcrH_T60GI"></script>
<script>
var myCenter = new google.maps.LatLng(52.010938, 5.437853);
function initialize() {
var mapProp = {
center:myCenter,
zoom:12,
scrollwheel:false,
draggable:false,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
var marker = new google.maps.Marker({
position:myCenter,
});
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<footer class="container-fluid text-center">
<a href="#myPage" title="To Top">
<span class="glyphicon glyphicon-chevron-up"></span>
</a>
<!-- <p>Bootstrap Theme Made By <a href="http://www.w3schools.com" title="Visit w3schools">www.w3schools.com</a></p> -->
</footer>
<script>
$(document).ready(function(){
// Add smooth scrolling to all links in navbar + footer link
$(".navbar a, footer a[href='#myPage']").on('click', function(event) {
// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {
// Prevent default anchor click behavior
event.preventDefault();
// Store hash
var hash = this.hash;
// Using jQuery's animate() method to add smooth page scroll
// The optional number (900) specifies the number of milliseconds it takes to scroll to the specified area
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 900, function(){
// Add hash (#) to URL when done scrolling (default click behavior)
window.location.hash = hash;
});
} // End if
});
$(window).scroll(function() {
$(".slideanim").each(function(){
var pos = $(this).offset().top;
var winTop = $(window).scrollTop();
if (pos < winTop + 600) {
$(this).addClass("slide");
}
});
});
})
</script>
</body>
</html>
我想改进 Accordion 的外观。 Accordion 的各个“盒子”都很高,可以容纳约 3 行文本。我想让它们靠得更近,这样它们就可以容纳 ~1.5 行文本。实现这一目标的最佳方法是什么?我是否应该调整 h4
的 line-height
参数(见下面的截图)?
最佳答案
关于javascript - 如何调整 Bootstrap Accordion 的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40715723/
有人可以告诉我 Bootstrap、Twitter Bootstrap 和 Bootstrap 3 之间有什么区别吗? 最佳答案 在 CSS 框架的上下文中,Bootstrap 和 Twitter B
什么是 Bootstrap 文档中的屏幕阅读器??? >>> bootstrap document 不知道什么是屏幕阅读器? 最佳答案 它是视力不佳或由于某种原因无法从屏幕上阅读的人使用的工具;它会向
我想更新网站上的 Bootstrap,但我不知道安装的版本。 如何仅使用 bootstrap.css 和 bootstrap.min.js 文件来识别 bootstrap 版本? CSS 文件中没有版
很抱歉问了这么一个愚蠢的问题,但我真的不清楚这些。 Bootstrap 是一个非常棒的库,它节省了开发人员的大量工作。 因为它提供了很多功能,比如 节省大量时间。 响应式功能。 一致的设计。 便于使用
我正在使用 ng2-bootstrap对于 Angular 2 项目。 这个包同时支持Bootstrap 3和4,我安装后默认使用Bootstrap 3。我没有找到任何关于切换的信息。 如何从 Boo
我计划在我的项目中使用 Bootstrap 4 和 angular 4,但我对 npm install --save @ng-bootstrap/ng-bootstrap 和 npm install
单击删除按钮后,我设置了警报。 但它的默认高度更大,我想让它更小(高度)。 我试过 display-4 属性(property),但它没有工作。 我已通过 w-50 将宽度设置为屏幕的一半,但警报的一
我使用 Bootstrap 按钮下拉菜单来显示表单。我通过调用 stopPropagation 禁用了单击时消失的下拉菜单(当用户操作表单时) .表单的元素之一是下拉列表。如果我使用 native h
twitter-bootstrap 中的“bootstrap”一词是什么意思?在许多 gem 中都有“bootstrap”这个词。我搜索了其中的含义,但无法得出结论。那么有人可以在这种情况下给出“Bo
由于 Bootstrap 5 不再使用 jQuery 并且正在使用 vanilla JS,我想知道是否仍然建议使用 Bootstrap-Vue,不管 Bootstrap-Vue 还不支持 Bootst
我正在使用 codeigniter 框架,我正在使用 bootstrap typeahead,一切都很好,但我的问题是当我将它放在 bootstrap 模式中时,bootstrap typeahead
我刚刚完成安装 bootstrap 5 版本 ^5.0.0-alpha1并在 app.js 中导入 Bootstrap import "bootstrap" 其他.js var myModal = n
我一直在尝试在使用选项卡的页面上实现 ScrollSpy。 这是我的 body 标签: 这是我的标签 HTML: Home Profile
如果您选择使用 Bootstrap-Xtra,您是否应该也包括原始的 bootstrap.css,或者 bootstrap-xtra.css 应该是一个完整的替代品。 例如,bootstrap-xtr
我正在使用 bootbox 创建一个对话框。 bootbox.dialog({ message: 'Datepicker input: ', title: "Custom label"
我正在将使用 Bootstrap 构建的 Web 应用程序迁移到 React 和 react-bootstrap,两者都很棒。我在 react-bootstrap 中没有看到的一件事是如何顺利集成 B
我正在使用 Bootstrap 3 RC,默认按钮是带有黑色文本的深灰色,而不是带有黑色文本的浅灰色。我已经尝试过 CDN 链接和离线。我还清空了我的浏览器缓存以防万一。有没有其他人经历过这个?这可能
在我的一个项目中,我曾经有 bootstrap-tagsinput http://timschlechter.github.io/bootstrap-tagsinput沿着 bootstrap-2.3
下拉菜单在 Angular-UI-Bootstrap 中不起作用?使用 Bootstrap-3 CSS 以下是代码。链接Click me for a dropdown出现。但不会在点击时切换。怎么了?
如何在 Bootstrap Table 中添加 Bootstrap 按钮 最佳答案 我已经想出了解决办法。我想和大家分享。 这是我的 table : # Visit
我是一名优秀的程序员,十分优秀!